相等運(yùn)算符
相等運(yùn)算符用來(lái)比較兩個(gè)值是否相等辽旋,
如果相等會(huì)返回true田巴,否則返回false
使用 == 來(lái)做相等運(yùn)算
- 當(dāng)使用==來(lái)比較兩個(gè)值時(shí)毁葱,如果值的類型不同忧勿,則會(huì)自動(dòng)進(jìn)行類型轉(zhuǎn)換杉女,將其轉(zhuǎn)換為相同的類型,然后再比較
不相等
不相等用來(lái)判斷兩個(gè)值是否不相等鸳吸,如果不相等返回true熏挎,否則返回false
- 使用 != 來(lái)做不相等運(yùn)算
- 不相等也會(huì)對(duì)變量進(jìn)行自動(dòng)的類型轉(zhuǎn)換,如果轉(zhuǎn)換后相等它也會(huì)返回false
===全等
- 用來(lái)判斷兩個(gè)值是否全等晌砾,它和相等類似坎拐,不同的是它不會(huì)做自動(dòng)的類型轉(zhuǎn)換
如果兩個(gè)值的類型不同,直接返回false
!==
不全等
- 用來(lái)判斷兩個(gè)值是否不全等贡羔,和不等類似廉白,不同的是它不會(huì)做自動(dòng)的類型轉(zhuǎn)換
如果兩個(gè)值的類型不同,直接返回true
==
console.log(b==NaN;//false
console.log(isNaN(b));//true
!=
===
!==
條件運(yùn)算符
也叫三元運(yùn)算符 三目運(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)算
true?alert(語(yǔ)句1):alert(語(yǔ)句2)聋溜;
true 就執(zhí)行語(yǔ)句1
false?alert(語(yǔ)句1):alert(語(yǔ)句2);
false就執(zhí)行語(yǔ)句2
運(yùn)算符的優(yōu)先級(jí)
運(yùn)算符 使用叭爱,可以分割多個(gè)語(yǔ)句撮躁,一般可以在聲明多個(gè)變量時(shí)使用
var a=1 b= 2 c =3
使用,運(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í)
var result = 1 + 2 * 3;
var result = 1 + 23;
如果||的優(yōu)先級(jí)高注盈,或者兩個(gè)一樣高,則應(yīng)該返回3
如果與的優(yōu)先級(jí)高叙赚,則應(yīng)該返回1
語(yǔ)句 statement
我們的程序是由一條一條語(yǔ)句構(gòu)成的
語(yǔ)句是按照自上向下的順序一條一條執(zhí)行的
在JS中可以使用{}來(lái)為語(yǔ)句進(jìn)行分組,
同一個(gè){}中的語(yǔ)句我們稱為是一組語(yǔ)句老客,
它們要么都執(zhí)行,要么都不執(zhí)行震叮,
一個(gè){}中的語(yǔ)句我們也稱為叫一個(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ù)
window.onload = function(){
document.getElementById('div1').title = "我看到了乌妒!";
變量oA代表整個(gè)a標(biāo)簽
var oA = document.getElementById('link1');
oA.;
oA.title = "跳轉(zhuǎn)到騰訊網(wǎng)"
alert(oA.id);
alert(oA.title);
}
js換膚
例子如下
<head>
<link rel="stylesheet" type="text/css" href="css/1.css" id="link1">
<script type="text/javascript">
window.onload = function(){
var oLink = document.getElementById('link1');
oLink.href = "css/2.css";
alert(oLink.id);
}
</script>
</head>
<body>
<div class="box01"></div>
<div class="box02"></div>
js操作style屬性
style屬性中的樣式屬性,沒(méi)有"-"號(hào)的外邓,寫(xiě)法相同
style屬性中的樣式屬性撤蚊,帶"-"號(hào)的需要去掉"-"號(hào),寫(xiě)成小駝峰式
例如:font-size屬性要寫(xiě)為fontSize
js操作class
由于class是js中的保留關(guān)鍵字损话,所以設(shè)置class屬性時(shí)侦啸,要寫(xiě)為className
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è)面的一部分
js函數(shù)
<head>
<script type="text/javascript">
function aa(){
alert('hello!');
}
/*直接調(diào)用
aa();*/
</script>
</head>
<body>
<input type="button" name="" value="彈框" onclick="aa()" />
js可控制換膚
<head>
<meta charset="UTF-8">
<title>js換膚</title>
<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>
</head>
<body>
<!-- 行間調(diào)用函數(shù)
<input type="button" name="" value="皮膚01" onclick="skin01()" />
<input type="button" name="" value="皮膚02" onclick="skin02()" /> -->
<input type="button" name="" value="皮膚01" id="btn01" />
<input type="button" name="" value="皮膚02" id="btn02" />
<div class="box01"></div>
<div class="box02"></div>
</body>
變量和函數(shù)預(yù)解析
/*變量預(yù)解析*/
alert(a);只把變量a的聲明提前忘闻,賦值不提前,所以彈出undefined恋博,表示它的值未定義
alert(c);//報(bào)錯(cuò)齐佳,c沒(méi)有聲明,這是真正的未定義
var a = 123;
/*函數(shù)預(yù)解析*/
myalert();//彈出hello!
function myalert(){
alert('hello!');
}
匿名函數(shù)
window.onload = function(){
var oDiv = document.getElementById('div1');
/*有名字的函數(shù)*/
oDiv.onclick = myalert;
function myalert(){
alert('hello');
}
/*匿名函數(shù)*/
oDiv.onclick = function(){
alert('hello');
函數(shù)傳參
window.onload = function(){
var oDiv = document.getElementById('div1');
changeStyle('color', 'gold');
changeStyle('background', 'red');
changeStyle('width', '300px');
changeStyle('height', '300px');
changeStyle('fontSize', '30px');
function changeStyle(styl, val){
oDiv.style[styl] = val;
函數(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í)行
流程控制語(yǔ)句
- JS中的程序是從上到下一行一行執(zhí)行的
- 通過(guò)流程控制語(yǔ)句可以控制程序執(zhí)行流程,使程序可以根據(jù)一定的條件來(lái)選擇執(zhí)行
- 語(yǔ)句的分類:
1.條件判斷語(yǔ)句
2.條件分支語(yǔ)句
3.循環(huán)語(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ǔ)句