相等運(yùn)算符
相等運(yùn)算符用來比較兩個(gè)值是否相等篡石,
如果相等會(huì)返回true芥喇,否則返回false
使用 == 來做相等運(yùn)算
- 當(dāng)使用==來比較兩個(gè)值時(shí),如果值的類型不同凰萨,則會(huì)自動(dòng)進(jìn)行類型轉(zhuǎn)換继控,將其轉(zhuǎn)換為相同的類型械馆,然后再比較
不相等
不相等用來判斷兩個(gè)值是否不相等,如果不相等返回true武通,否則返回false
- 使用 != 來做不相等運(yùn)算
- 不相等也會(huì)對(duì)變量進(jìn)行自動(dòng)的類型轉(zhuǎn)換霹崎,如果轉(zhuǎn)換后相等它也會(huì)返回false
=== 全等
- 用來判斷兩個(gè)值是否全等,它和相等類似冶忱,不同的是它不會(huì)做自動(dòng)的類型轉(zhuǎn)換
如果兩個(gè)值的類型不同尾菇,直接返回false
!== 不全等
- 用來判斷兩個(gè)值是否不全等,和不等類似囚枪,不同的是它不會(huì)做自動(dòng)的類型轉(zhuǎn)換
如果兩個(gè)值的類型不同派诬,直接返回true
條件運(yùn)算符
條件運(yùn)算符也叫三元運(yùn)算符
語法:
條件表達(dá)式?語句1:語句2;
- 執(zhí)行的流程:
條件運(yùn)算符在執(zhí)行時(shí),首先對(duì)條件表達(dá)式進(jìn)行求值链沼,
如果該值為true默赂,則執(zhí)行語句1,并返回執(zhí)行結(jié)果
如果該值為false括勺,則執(zhí)行語句2缆八,并返回執(zhí)行結(jié)果
如果條件的表達(dá)式的求值結(jié)果是一個(gè)非布爾值,會(huì)將其轉(zhuǎn)換為布爾值然后在運(yùn)算
運(yùn)算符得優(yōu)先級(jí)
, 運(yùn)算符
使用,可以分割多個(gè)語句疾捍,一般可以在聲明多個(gè)變量時(shí)使用
*/
//使用,運(yùn)算符同時(shí)聲明多個(gè)變量
//var a, b, c;
//可以同時(shí)聲明多個(gè)變量并賦值
//var a=1, b=2, c=3;
//alert(b);
/*
就和數(shù)學(xué)中一樣耀里,在JS中運(yùn)算符也有優(yōu)先級(jí),
比如:先乘除 后加減
在JS中有一個(gè)運(yùn)算符優(yōu)先級(jí)的表拾氓,
在表中越靠上優(yōu)先級(jí)越高冯挎,優(yōu)先級(jí)越高越優(yōu)先計(jì)算
如果優(yōu)先級(jí)一樣,則從左往右計(jì)算
但是這個(gè)表我們并不需要記憶咙鞍,如果遇到優(yōu)先級(jí)不清楚
可以使用()來改變優(yōu)先級(jí)
代碼塊
我們的程序是由一條一條語句構(gòu)成的
語句是按照自上向下的順序一條一條執(zhí)行的
在JS中可以使用{}來為語句進(jìn)行分組,
同一個(gè){}中的語句我們稱為是一組語句房官,
它們要么都執(zhí)行,要么都不執(zhí)行续滋,
一個(gè){}中的語句我們也稱為叫一個(gè)代碼塊
在代碼塊的后邊就不用再編寫;了
JS中的代碼塊翰守,只具有分組的的作用,沒有其他的用途
代碼塊內(nèi)容的內(nèi)容疲酌,在外部是完全可見的
js操作屬性
DOM是為了操作文檔(網(wǎng)頁(yè))的API蜡峰,document是它的一個(gè)對(duì)象
BOM是為了操作瀏覽器的API,window是它的一個(gè)對(duì)象
常用BOM對(duì)象還有:alert朗恳、定時(shí)器等
//整個(gè)文檔加載完之后執(zhí)行一個(gè)匿名函數(shù)
js換膚
js操作style屬性
js操作class
js中括號(hào)操作屬性
window.onload = function(){
var oDiv = document.getElementById('div1');
//oDiv.style.color = 'red';//red必須加引號(hào)湿颅,否則會(huì)認(rèn)為它是一個(gè)變量,引起來會(huì)認(rèn)為它是一個(gè)值粥诫,賦值給=號(hào)左邊
var attr = 'color';
// oDiv.style[attr] = 'red';
/* 通過[]操作屬性可以寫變量 */
oDiv['style'][attr] = 'red';
/* 通過innerHTML可以讀寫元素包括的內(nèi)容 */
alert(oDiv.innerHTML);//讀取標(biāo)簽里面包裹的元素油航,即“這是一個(gè)div元素”
var oDiv2 = document.getElementById('div2');
// oDiv2.innerHTML = '這是第二個(gè)div元素';//向div標(biāo)簽中插入內(nèi)容
oDiv2.innerHTML = "<a ;//向div標(biāo)簽中插入超鏈接標(biāo)簽
document.write和innerHTML的區(qū)別
document.write只能重繪整個(gè)頁(yè)面
innerHTML可以重繪頁(yè)面的一部分
************************************************
<div id="div1">這是一個(gè)div元素</div>
<div id="div2"></div>
js函數(shù)
js可控制換膚
<link rel="stylesheet" type="text/css" href="css/1.css" id="link1">
<script type="text/javascript">
window.onload = function(){
/* 提取行間事件 */
var oBtn01 = document.getElementById('btn01');
var oBtn02 = document.getElementById('btn02');
oBtn01.onclick = skin01;//這里不能寫skin01(),這樣寫就馬上執(zhí)行了
oBtn02.onclick = skin02;
}
function skin01(){
var oLink = document.getElementById('link1');
oLink.href = "css/1.css";
}
function skin02(){
var oLink = document.getElementById('link1');
oLink.href = "css/2.css";
}
</script>
***********************************
<input type="button" name="" value="皮膚01" id="btn01" />
<input type="button" name="" value="皮膚02" id="btn02" />
<div class="box01"></div>
<div class="box02"></div>
變量和函數(shù)欲解析
匿名函數(shù)
<div id="div1">這是一個(gè)div元素</div>
函數(shù)傳參
函數(shù)return關(guān)鍵字
window.onload = function(){
var oInput01 = document.getElementById('input01');
var oInput02 = document.getElementById('input02');
var oBtn = document.getElementById('btn');
//寫入值
// oInput01.value = 10;
// oInput02.value = 5;
oBtn.onclick = function(){
var val01 = oInput01.value;
var val02 = oInput02.value;
var rs = add(val01, val02);
alert(rs);
}
function add(a, b){
var c = parseInt(a) + parseInt(b);
// alert('計(jì)算完成');//執(zhí)行
return c;//返回函數(shù)設(shè)定的值怀浆,同時(shí)結(jié)束函數(shù)的運(yùn)行
// return;//不返回值谊囚,僅結(jié)束函數(shù)的運(yùn)行
// alert('計(jì)算完成');//不執(zhí)行
}
}
</script>
***************************************
<input id="input01" type="text" name="">
<input id="input02" type="text" name="">
<input id="btn" type="button" name="" value="相加">
流程控制語句
流程控制語句
- JS中的程序是從上到下一行一行執(zhí)行的
- 通過流程控制語句可以控制程序執(zhí)行流程怕享,
使程序可以根據(jù)一定的條件來選擇執(zhí)行
- 語句的分類:
1.條件判斷語句
2.條件分支語句
3.循環(huán)語句
console.log('你好');
alert('hello');
條件判斷語句
條件判斷語句:
- 使用條件判斷語句可以在執(zhí)行某個(gè)語句之前進(jìn)行判斷,
如果條件成立才會(huì)執(zhí)行語句镰踏,條件不成立則語句不執(zhí)行函筋。
- if語句
- 語法一:
if(條件表達(dá)式){
語句...
}
if語句在執(zhí)行時(shí),會(huì)先對(duì)條件表達(dá)式進(jìn)行求值判斷奠伪,
如果條件表達(dá)式的值為true驻呐,則執(zhí)行if后的語句,
如果條件表達(dá)式的值為false芳来,則不會(huì)執(zhí)行if后的語句含末。
if語句只能控制緊隨其后的那個(gè)語句,
如果希望if語句可以控制多條語句,
可以將這些語句統(tǒng)一放到代碼塊中
if語句后的代碼塊(即{})不是必須的即舌,但是在開發(fā)中盡量寫上代碼塊佣盒,即使if后只有一條語句
- 語法二:
if(條件表達(dá)式){
語句...
}else{
語句...
}
if...else...語句
當(dāng)該語句執(zhí)行時(shí),會(huì)先對(duì)if后的條件表達(dá)式進(jìn)行求值判斷顽聂,
如果該值為true肥惭,則執(zhí)行if后的語句
如果該值為false,則執(zhí)行else后的語句
input type="button" value="切換" id="btn">
<br>
<div class="box" id="box"></div>