if語句
if...else
語法:
if(條件){
代碼塊1;
}else{
代碼塊2;
}
執行規則:
若條件成立,則執行代碼塊1,否則執行代碼塊2
可穿插else if 實現多分枝if語句
switch語句
switch語法
switch語法
switch(條件){
case 值:
代碼塊;
break;
case 值:
代碼塊;
break;
case 值:
代碼塊;
break;
...
break;
deafault:
代碼塊;
break;
}
執行規則:
使用條件分別和case後面的值作比較,若相等則執行case對應的語句
若均不成立,則執行default中的代碼
注意:該結構只能用於值得比較,不能用於範圍比較
該結構是全等(===)比較
for循環
循環結構
for循環
語法:
for(循環變量的初始化;循環判斷;循環迭代){
循環體;
}
執行規則:
第一步:循環變量的初始化 var i=0
第二步:循環條件的判斷 i<5
若判斷結果爲真,則執行循環體
若判斷結果爲假,則結束循環
第三步:循環迭代 i++
第四步:回到第二步
循環停止
if(停止條件){break}
循環嵌套和語句嵌套
語句間可以穿插其他語句實現嵌套
例如: 輸出如下圖形:
*
***
*****
*******
行號: 空格數
1 3
2 2
3 1
4 0
總行:4
*/
//控制*的行數
for(var i=1;i<5;i++){
//輸出空格
for(var m=0;m<4-i;m++){
document.write(' ');
}
//輸出一行*
for(var j=0;j<2*i-1;j++){
document.write('*');
}
//換行
document.write('<br>');
}
做一個簡單的計算器
<body>
<input type="text" id="txt-op1">
<select name="" id="slt">
<option >+</option>
<option >-</option>
<option >*</option>
<option >/</option>
</select>
<input type="text" id="txt-op2">
<button id="btn">=</button>
<input type="text" id="txt-result">
<script>
//根據ID查找頁面元素
var btn=document.getElementById('btn');
var txt1=document.getElementById('txt-op1');
var txt2=document.getElementById('txt-op2');
var txtValue=document.getElementById('txt-result');
var slt=document.getElementById('slt');
var endValue;//運算結果
// console.log(btn);
//添加點擊事件
btn.onclick=function(){
// console.log(txt1.value,txt2.value);
// console.log(slt.value);
// txt1.value slt.value txt2.value;
switch(slt.value){
case "+":
endValue=parseFloat(txt1.value)+parseFloat(txt2.value);
break;
case "-":
endValue=txt1.value-txt2.value;
break;
case '*':
endValue=txt1.value*txt2.value;
break;
case '/':
endValue=txt1.value/txt2.value;
break;
default:
endValue=txt1.value+txt2.value;
break;
}
// console.log(endValue);
//將數據展示到頁面中
txtValue.value=endValue;
};
</script>