JS-用js的for循環實現九九乘法表以及其他算數題等

 

<style>  2  .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; 2 for(var h=1;h<=100;h++){ 3     he+=h; 4 } 5 document.write('1-100之間的和是'+he); 6 document.write('<hr color="#00FFFF"/>');

 

求1-100之間奇數的和

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

求1-100之間偶數的和

var osum=0; 2 for(var k=1;k<=100;k++){ 3     if(k%2==0){ 4         osum+=k; 5  } 6 } 7 document.write('偶數的和='+osum); 8 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++){ 2     document.write('一、這是外層包裹——第'+n+'層。<br/>'); 3     document.write('<hr color="antiquewhite"/>'); 4     for(var o=1;o<=2;o++){ 5         document.write('1、這是內層的——第'+o+'層。<br/>'); 6  } 7     document.write('<hr color="chartreuse"/>'); 8 }

當n等於1時，先把內部的for'循環完，再執行n++，然后n=2，再把內層for循環過一遍'
重點在於搞准確for循環的執行流程

制作5*4的表格

　——輸出幾行幾列的表格

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

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

for循環的嵌套——九九乘法口訣表

自己寫1

document.write('<table class="table" border="1">');  2 for(var r=1;r<=9;r++){  3     document.write('<tr>');  4     for(var s=1;s<=9;s++){  5         document.write('<td>'+s+'*'+r+'='+(r*s)+'</td>');  6  }  7     document.write('</tr>');  8 }  9 document.write('</table>'); 10 document.write('<hr color="red"/>')

自己制作第二個：

和第一個相比，錯在核心位置了！！！第二個乘數應該小於等於第一個乘數，才會出現口訣表那樣的樣式。如下。t<=u是核心

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

更改，原理不變調數據——變化1

document.write('<hr color="red"/>');  2 document.write('<table class="table" border="1">');  3 for(var v=9; v>=1; v--){  4     document.write('<tr>');  5     for(var w=1; w<=v; w++){  6         document.write('<td>'+w+'x'+v+'='+(w*v)+'</td>');  7  }  8     document.write('</tr>');  9 } 10 document.write('</table>'); 11 document.write('<hr color="red"/>');

打印一個倒得乘法口訣表

自己創作的第一種形式——變化2

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

自己創作的第二種形式_寫法上和第一個不一樣，但是效果是一樣的——變化3

document.write('<hr color="red"/>');  2 document.write('<table class="table" border="1"/>');  3 for(var x=1;x<=9;x++){  4     document.write('<tr>');  5     for(var y=9;y>=x;y--){  6         document.write('<td>'+x+'x'+y+'='+(x*y)+'</td>');  7  }  8     document.write('</tr>');  9 } 10 document.write('</table>'); 11 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++){ 2     for(var y=0;y<=33;y++){ 3         for(var n=0;n<=100;n++){ 4             if((x+y+n==100)&&(5*x+3*y+n/3==100)){
                document.write('需要買公雞：'+x+'只，母雞：'+y+'只，小雞：'+n+'只。<hr/>'); 6  } 7  } 8  } 9 }

2、兩層for嵌套。相對來說，比三層的效率要好點，輕量。

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