相等運(yùn)算符
相等運(yùn)算符用來(lái)比較兩個(gè)值是否相等,
如果相等會(huì)返回true,否則返回false
使用 == 來(lái)做相等運(yùn)算
- 當(dāng)使用==來(lái)比較兩個(gè)值時(shí),如果值的類(lèi)型不同,則會(huì)自動(dòng)進(jìn)行類(lèi)型轉(zhuǎn)換,將其轉(zhuǎn)換為相同的類(lèi)型,然后再比較
不相等
不相等用來(lái)判斷兩個(gè)值是否不相等,如果不相等返回true,否則返回false
- 使用 != 來(lái)做不相等運(yùn)算
- 不相等也會(huì)對(duì)變量進(jìn)行自動(dòng)的類(lèi)型轉(zhuǎn)換,如果轉(zhuǎn)換后相等它也會(huì)返回false
=== 全等
- 用來(lái)判斷兩個(gè)值是否全等,它和相等類(lèi)似,不同的是它不會(huì)做自動(dòng)的類(lèi)型轉(zhuǎn)換
如果兩個(gè)值的類(lèi)型不同,直接返回false
!== 不全等
- 用來(lái)判斷兩個(gè)值是否不全等,和不等類(lèi)似,不同的是它不會(huì)做自動(dòng)的類(lèi)型轉(zhuǎn)換
如果兩個(gè)值的類(lèi)型不同,直接返回true
條件運(yùn)算符
條件運(yùn)算符也叫三元運(yùn)算符
語(yǔ)法:
條件表達(dá)式?語(yǔ)句1:語(yǔ)句2;
- 執(zhí)行的流程:
條件運(yùn)算符在執(zhí)行時(shí),首先對(duì)條件表達(dá)式進(jìn)行求值,
如果該值為true,則執(zhí)行語(yǔ)句1,并返回執(zhí)行結(jié)果
如果該值為false,則執(zhí)行語(yǔ)句2,并返回執(zhí)行結(jié)果
如果條件的表達(dá)式的求值結(jié)果是一個(gè)非布爾值,會(huì)將其轉(zhuǎn)換為布爾值然后在運(yùn)算

運(yùn)算符得優(yōu)先級(jí)
, 運(yùn)算符
使用,可以分割多個(gè)語(yǔ)句,一般可以在聲明多個(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í)不清楚
可以使用()來(lái)改變優(yōu)先級(jí)

代碼塊
我們的程序是由一條一條語(yǔ)句構(gòu)成的
語(yǔ)句是按照自上向下的順序一條一條執(zhí)行的
在JS中可以使用{}來(lái)為語(yǔ)句進(jìn)行分組,
同一個(gè){}中的語(yǔ)句我們稱(chēng)為是一組語(yǔ)句,
它們要么都執(zhí)行,要么都不執(zhí)行,
一個(gè){}中的語(yǔ)句我們也稱(chēng)為叫一個(gè)代碼塊
在代碼塊的后邊就不用再編寫(xiě);了
JS中的代碼塊,只具有分組的的作用,沒(méi)有其他的用途
代碼塊內(nèi)容的內(nèi)容,在外部是完全可見(jiàn)的

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è)變量,引起來(lái)會(huì)認(rèn)為它是一個(gè)值,賦值給=號(hào)左邊
var attr = 'color';
// oDiv.style[attr] = 'red';
/* 通過(guò)[]操作屬性可以寫(xiě)變量 */
oDiv['style'][attr] = 'red';
/* 通過(guò)innerHTML可以讀寫(xiě)元素包括的內(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;//這里不能寫(xiě)skin01(),這樣寫(xiě)就馬上執(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');
//寫(xiě)入值
// 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="相加">
流程控制語(yǔ)句
流程控制語(yǔ)句
- JS中的程序是從上到下一行一行執(zhí)行的
- 通過(guò)流程控制語(yǔ)句可以控制程序執(zhí)行流程,
使程序可以根據(jù)一定的條件來(lái)選擇執(zhí)行
- 語(yǔ)句的分類(lèi):
1.條件判斷語(yǔ)句
2.條件分支語(yǔ)句
3.循環(huán)語(yǔ)句
console.log('你好');
alert('hello');
條件判斷語(yǔ)句
條件判斷語(yǔ)句:
- 使用條件判斷語(yǔ)句可以在執(zhí)行某個(gè)語(yǔ)句之前進(jìn)行判斷,
如果條件成立才會(huì)執(zhí)行語(yǔ)句,條件不成立則語(yǔ)句不執(zhí)行。
- if語(yǔ)句
- 語(yǔ)法一:
if(條件表達(dá)式){
語(yǔ)句...
}
if語(yǔ)句在執(zhí)行時(shí),會(huì)先對(duì)條件表達(dá)式進(jìn)行求值判斷,
如果條件表達(dá)式的值為true,則執(zhí)行if后的語(yǔ)句,
如果條件表達(dá)式的值為false,則不會(huì)執(zhí)行if后的語(yǔ)句。
if語(yǔ)句只能控制緊隨其后的那個(gè)語(yǔ)句,
如果希望if語(yǔ)句可以控制多條語(yǔ)句,
可以將這些語(yǔ)句統(tǒng)一放到代碼塊中
if語(yǔ)句后的代碼塊(即{})不是必須的,但是在開(kāi)發(fā)中盡量寫(xiě)上代碼塊,即使if后只有一條語(yǔ)句
- 語(yǔ)法二:
if(條件表達(dá)式){
語(yǔ)句...
}else{
語(yǔ)句...
}
if...else...語(yǔ)句
當(dāng)該語(yǔ)句執(zhí)行時(shí),會(huì)先對(duì)if后的條件表達(dá)式進(jìn)行求值判斷,
如果該值為true,則執(zhí)行if后的語(yǔ)句
如果該值為false,則執(zhí)行else后的語(yǔ)句

input type="button" value="切換" id="btn">
<br>
<div class="box" id="box"></div>