while 循环的使用方法
      回顾for循环的结构
      for (循环变量初始化; 循环条件; 循环增量) {
      循环体;
    找出1～100 之间所有能被3整除的数,打印并得到个数
      var count = 0; //用于记录目标数的个数
      for (var i = 1; i <= 100; i++) {
        if (i % 3 == 0 ) {
          console.log(i);
          count++;
        }
      }
      console.log(count);
      while循环的格式:
      while (循环条件) {
      循环体;
    }
      var number = 100;
      count = 0;
      while (number) {
        if (number % 3 ==0) {
          console.log(number);
          count++;
        }
        number--;
      }
      console.log(count);
      do-while循环结构
      do {
      循环体;
    }while(循环条件)
       while循环和do-while循环同为不知道循环次数的循环。
       两者最大的区别在于：while循环先判断条件为真，执行循环体，有可能一次也不执行。
      do-while先执行循环体，再判断循环条件是否为真，为真则继续执行下一次循环。do-while至少执行一次循环
    var  number = 100;
    var  count = 0;
      do {
        if (number % 3 ==0) {
          count++;
        }
        number--;
      }while(number)；
      1、单目运算符：++  --，例如：a++
     2、双目运算符： ＋ － * /等 例如 a + b
     3、三目运算符：？： 例如: a < b ? a : b 经常用作求最大值或最小值
       for循环
      var sum = 0;
      for (i = 1; i <= 100; i++) {
        sum = sum + i;
      }
      alert(sum);
      for (循环变量初始化(1) ; 循环条件(2) ; 循环增量(3)){
      循环体(4);
    }
    for 循环的执行顺序为：(1)->(2)->(4)->(3)->(2)->(4)->(3)...->(2)
 
事例1：闰年｜星座查询｜输入年月日判断是第几天
<!DOCTYPE html>
<html>
  <head>
    <meta charset ="utf-8">
    <title>星座查询｜输入年月日判断是第几天</title>
  </head>
  <body>
    <form class="" action="index.html" method="post">
      <input type ="text" id="year" value ="" placeholder="请输入年份">
      <input type="text" id="month" value="" placeholder="请输入月份">
      <input type="text" id="day" value="" placeholder="请输入日期">
      <input type="button" id="confirm" value="查询">
    </form>
  </body>
  <script type="text/javascript">
    var confirm = document.getElementById("confirm");
    var year = document.getElementById("year");
    var month = document.getElementById("month");
    var day = document.getElementById("day");
    confirm.onclick = function() {
    var years = parseInt(year.value);
    var months = parseInt(month.value);
    var days = parseInt(day.value);
    var constellation = months * 100 + days;
    var result = 0;
    //闰年判断条件：能被4整除&&不被100整除 || 能被400整除
    var leapYear = (years % 4 == 0)&& (years % 100 != 0) || (years % 400 == 0); //判断时否是闰年
    if (constellation >=120 && constellation <=218) {
        alert(months + "月" + days + '日是：水平座');
      }else if (constellation >=219 && constellation <=320) {
        alert(months + "月" + days + '日是：双鱼座');
      }else if (constellation >=321 && constellation <=419) {
        alert(months + "月" + days + '日是：白羊座');
      }else if (constellation >=420 && constellation <=520) {
        alert(months + "月" + days + '日是：金牛座');
      }else if (constellation >=521 && constellation <=621) {
        alert(months + "月" + days + '日是：双子座');
      }else if (constellation >=622 && constellation <=722) {
        alert(months + "月" + days + '日是：巨蟹座');
      }else if (constellation >=723 && constellation <=822) {
        alert(months + "月" + days + '日是：狮子座');
      }else if (constellation >=823 && constellation <=922) {
        alert(months + "月" + days + '日是：处女座');
      }else if (constellation >=923 && constellation <=1023) {
        alert(months + "月" + days + '日是：天秤座');
      }else if (constellation >=1024 && constellation <=1122) {
        alert(months + "月" + days + '日是：天蝎座');
      }else if (constellation >=1123 && constellation <=1221) {
        alert(months + "月" + days + '日是：射手座');
      }else if (constellation >=1222 && constellation <=119) {
        alert(months + "月" + days + '日是：魔蝎座');
      }
      switch(months - 1) {
        case 11:
          result += 30;
        case 10:
          result += 31;
        case 9:
          result += 30;
        case 8:
          result += 31;
        case 7:
          result += 31;
        case 6:
          result += 30;
        case 5:
          result += 31;
        case 4:
          result += 30;
        case 3:
          result += 31;
        case 2:
          result += leapYear ? 29 : 28;
        case 1:
          result += 31;
        result = result + days;
      alert(years + "年" + months + "月" + days + "日是今年的第"+result+"天");
  }
}
  </script>
</html>
 
事例2：冒泡排序｜选择排序｜最大公约数
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>冒泡排序｜选择排序｜最大公约数</title>
  </head>
  <body>
  </body>
  <script>
    //  随机生成20个10～30的整数
    var array = [];
    for( var i = 0; i < 20; i++) {
         array[i] = Math.floor(Math.random() * 21 + 10);
    }
  // 将生成的随机数按升序排列、冒泡排序
    for( var i = 0; i < array.length - 1; i++) {
        for(var j = 0; j < array.length - 1 - i; j++) {
              if(array[j] > array[j+1]) {
                   var temp = array[j];
                   array[j] = array[j+1];
                   array[j+1] = temp;
                }
          }
    }
    // 将生成的随机数按降序排列、冒泡排序
    for( var i = 0; i < array.length - 1; i++) {
      for(var j = 0; j < array.length - 1 - i; j++) {
        if(array[j] < array[j+1]) {
          var temp = array[j];
          array[j] = array[j+1];
          array[j+1] = temp;
        }
      }
    }
// 将生成的随机数按降序排列、选择排序
    for( var i = 0; i < array.length - 1; i++) {
      var min = array[i];
      var index = i;
      for(var j = i + 1; j < array.length; j++) {
        if(array[j] < min) {
          min = array[j];
          index = j;
        }
      }
      if( i != index) {
        var temp = array[index];
        array[index] = array[i];
        array[i] = temp;
      }
    }
// 将生成的随机数按降序排列、选择排序
    for( var i = 0; i < array.length - 1; i++) {
      var max = array[i];
      var index = i;
      for(var j = i + 1; j < array.length; j++) {
          if(array[j] > max) {
               max = array[j];
               index = j;
          }
     }
     if( i != index) {
          var temp = array[index];
          array[index] = array[i];
          array[i] = temp;
     }
  }
  // 定义一个带有回调函数的冒泡排序函数，回调函数用于确定数组是升序排序还是降序排序
  function bubbleSort(array,callback) {
    for (var i = 0; i < array.length - 1; i++) {
      for (var j = 0; j < array.length - i - 1; j++) {
          if (callback(array[j],array[j+1])) {
          var tem = array[j];
          array[j] = array[j+1];
          array[j+1] = tem;
        }
      }
    }
  }
  function ascending(a,b) {
    return a > b;
  }
  function dscending(a,b) {
    return a < b;
  }
  var array = [2,4,5,8,6,7,1,9,3];
  bubbleSort(array,ascending);
  bubbleSort(array,dscending);
 
//最大公约数算法：辗转相除法
// 辗转相除法，例如：78 ，42
/* 
1、78/42 余数 36；
 2、 42/36 余数 6；
 3、 36/6  余数 0；
 4、 最大公约数就是6
＊/
      a = 27;
      b = 36;
      while ( a % b != 0) {
        var c = a % b;
        a = b;
        b = c;
      }
console.log(b);
</script>
</html>
事例3: 九九乘法表
<!DOCTYPE html>
<html>
     <head>
          <meta charset = "utf-8" >
          <title>九九乘法表</title>
          <style media="screen">
            * {
              margin: 0px;
              padding: 0px;
            }
          </style>
     </head>
     <body>
     </body>
          <script type = "text/javascript">
               var body = document.getElementsByTagName("body")[0];
               var h1 = document.createElement("h1");
               body.appendChild(h1);
               h1.style.color = "blue";
               h1.style.width = "100%";
               h1.style.textAlign = "center";
               h1.innerHTML = "九九乘法表";
               var wrap = document.createElement("div");
               body.appendChild(wrap);
               wrap.style.width = "820px";
               wrap.style.height = "400px";
               wrap.style.margin = "0 auto";
               for ( var i = 0; i <=  9; i++ ) {
                    for( var j = 0; j <= i; j++) {
                         var p = document.createElement("p");
                          wrap.appendChild(p);
                          p.innerHTML = i + "&times" + j + "=" + j*i;
                          p.style.display = "inline-block";
                          p.style.width = "80px";
                          p.style.height = "30px";
                          p.style.lineHeight = "30px";
                          p.style.border = "1px solid grey";
                          p.style.textAlign = "center";
                    }
                   var br = document.createElement("br");
                    wrap.appendChild(br);
               }
          </script>
</html>