JS-用js的for循环实现九九乘法表以及其他算数题等

<style>
    .table{
        background-color: #f0f0f0;
        border: 1px solid #7FFFD4;
    }
    table{
        width:90%; 
        background:#7FFFD4; 
    }
</style>

for：

1.语法：
for(exp1;exp2;exp3){
　　循环执行函数
}

2.参数：
exp1：默认的第一个执行的数值
exp2：决定函数能否循环的限制条件。条件不成立时循环结束
exp3：每次循环时，数值变化情况

for(var i=1; i<=10;i++){//i++后缀式，会先执行复合条件时的函数，后加一位。
    document.write('hello world<br/>');
    document.write('第'+i+'列、'+'<br/>');
}
document.write(i);
document.write('<hr color="red">');//在js中直接写html标签和属性内容。用字符串引进来

循环输出0-100

for(var a=0; a<=100; a++){
    document.write(a+'<br/>')
}
document.write('<hr color="red">');

循环输出 100-10

for(var b=100; b>=10; b--){
    document.write(b+'<br/>');
}

循环输出1-100之间的~奇数

document.write('<hr color="red"/>')
for(var c=1; c<=10; c+=2){//每次让c+2，而不是每次加以，奇数公式：n+2，偶数公式：2n
    document.write(c+'<br/>');
}

方法二

document.write('<hr color="#00FFFF"/>');
for(var e=11; e<=20; e++){
    if(e%2==1){//e除以二余一。表明是奇数
        document.write(e+'<br/>');
    }
}
document.write('<hr color="red"/>');

重要思想：e%2 == 1【e除以二余一。表明是奇数】

计算~偶数

for(var d=2;d<=10;d+=2){//初始值设置为偶数
    document.write(d+'<br/>');
}

方法二

document.write('<hr color="#00FFFF"/>')
for(var f=11;f<=20;f++){
    if(f%2==0){//偶数除以二都余零
        document.write(f+'<br/>');
    }
}
document.write('<hr color="chartreuse"/>');

// for(var g=1; g<=10;g++){
//　　 document.write((g%2==1)+'<br/>');
// }

输出1-100之间数字的~和

//    var sum =0;
//    for(var i=1;i<=100;i++){
//    document.write(sum+=i);
//    }错误写法示范，自己想错了，sum应该等于每次加一个i。然后写出sum的和的值

var he = 0;
for(var h=1;h<=100;h++){
    he+=h;
}
document.write('1-100之间的和是'+he);
document.write('<hr color="#00FFFF"/>');

 

求1-100之间奇数的和

var jsum=0;
for(var j=1;j<=100;j+=2){
    jsum+=j;
}
document.write('奇数的和='+jsum);
document.write('<hr color="#00FFFF"/>');

求1-100之间偶数的和

var osum=0;
for(var k=1;k<=100;k++){
    if(k%2==0){
        osum+=k;
    }
}
document.write('偶数的和='+osum);
document.write('<hr color="chartreuse"/>')

 

死循环以及停止死循环的方式：break

for(var l=1;l>=0;l++){
//因为L永远大于或等于0，所以此条件无限成立因此无限循环，若用break，停止循环跳出for函数，若用continue，跳过continue对应的本次循环后继续循环
    //document.write(l);//这么些会把机子搞崩溃的，这个做病毒不错，打开网页会显示一直显示加载中。
    if(l>=20){
        break;
    }//等于20的时候，会停止并跳出循环，不会执行下边的document函数，自然就不会把20写出来
    document.write(l+'<br/>');
    //停止的写法
}
document.write('<hr color="red"/>');

continue

for(var m=1;m<=10;m++){
    if(m==5){
        continue;
    }
    document.write(m+'<br/>');
}///结果没有5
document.write('<hr/>')

for循环嵌套语句

for(var n=1;n<=3;n++){
    document.write('一、这是外层包裹——第'+n+'层。<br/>');
    document.write('<hr color="antiquewhite"/>');
    for(var o=1;o<=2;o++){
        document.write('1、这是内层的——第'+o+'层。<br/>');
    }
    document.write('<hr color="chartreuse"/>');    
}

当n等于1时，先把内部的for'循环完，再执行n++，然后n=2，再把内层for循环过一遍'
重点在于搞准确for循环的执行流程

制作5*4的表格

　——输出几行几列的表格

document.write('<table class="table" border="1">');
for(var p=1;p<=5;p++){
    document.write('<tr>');
    for(var q=1;q<=4;q++){
        document.write('<td align="center">文字</td>')
    }
    document.write('</tr>');
}
document.write('</table>')
document.write('<hr color="red"/>');

同理，制作九九乘法口诀表

for循环的嵌套——九九乘法口诀表

自己写1

document.write('<table class="table" border="1">');
for(var r=1;r<=9;r++){
    document.write('<tr>');
    for(var s=1;s<=9;s++){
        document.write('<td>'+s+'*'+r+'='+(r*s)+'</td>');
    }
    document.write('</tr>');
}
document.write('</table>');
document.write('<hr color="red"/>')

自己制作第二个：

和第一个相比，错在核心位置了！！！第二个乘数应该小于等于第一个乘数，才会出现口诀表那样的样式。如下。t<=u是核心

document.write('<table class="table" border="1">');
for(var t=1;t<=9;t++){
    document.write('<tr>');
    for(var u=1;u<=t;u++){
        document.write('<td>'+u+'x'+t+'='+(u*t)+'</td>');
    }
    document.write('</tr>');
}
document.write('</table>');

更改，原理不变调数据——变化1

document.write('<hr color="red"/>');
document.write('<table class="table" border="1">');
for(var v=9; v>=1; v--){
    document.write('<tr>');
    for(var w=1; w<=v; w++){
        document.write('<td>'+w+'x'+v+'='+(w*v)+'</td>');
    }
    document.write('</tr>');
}
document.write('</table>');
document.write('<hr color="red"/>');

打印一个倒得乘法口诀表

自己创作的第一种形式——变化2

document.write('<table class="table" border="1">');
for(var v=9; v>=1; v--){
    document.write('<tr>');
    for(var w=9; w>=v; w--){
        document.write('<td>'+v+'x'+w+'='+(w*v)+'</td>');
    }
    document.write('</tr>');
}
document.write('</table>');

自己创作的第二种形式_写法上和第一个不一样，但是效果是一样的——变化3

document.write('<hr color="red"/>');
document.write('<table class="table" border="1"/>');
for(var x=1;x<=9;x++){
    document.write('<tr>');
    for(var y=9;y>=x;y--){
        document.write('<td>'+x+'x'+y+'='+(x*y)+'</td>');
    }
    document.write('</tr>');
}
document.write('</table>');
document.write('<hr color="red"/>');

for循环实现百钱买百鸡的问题：

公鸡5元一只，母鸡3元一只，小鸡1元3只，100元要买100只鸡？有多少买法？
设：公鸡买x只，母鸡y只，小鸡n只，则，x+y+n==100（只）因为只需要买100只，最多不能超过100只。

钱数上：5*x+3*y+3/n==100(元),【切记，小鸡的价格是数量除以3】只有100元，多了没有。

有因为，100元最多买公鸡20只/母鸡33只/小鸡100（因为只需要买100只，尽管钱数可以买300只，但是不需要都是多余的）只。所以for循环如下两种方式：

1、三层for嵌套

for(var x=0;x<=20;x++){
    for(var y=0;y<=33;y++){
        for(var n=0;n<=100;n++){
            if((x+y+n==100)&&(5*x+3*y+n/3==100)){
                document.write('需要买公鸡：'+x+'只，母鸡：'+y+'只，小鸡：'+n+'只。<hr/>');
            }
        }
    }
}

2、两层for嵌套。相对来说，比三层的效率要好点，轻量。

document.write('<hr color="red"/>');
for(var a=0;a<=20;a++){
    for(var b=0;b<=33;b++){
        c=100-a-b;
        if((c%3==0)&&(5*a+3*b+c/3==100)){
            document.write('公鸡'+a+'只，母鸡'+b+'只，小鸡'+c+'只.<hr/>');
        }
    }
}
document.write('<hr color="red"/>');