js小知識點
整理
js小知識點
(一)：獲取元素
<script type="text/javascript">
1:document.getElementById('id名');
2:document.getElementsByTagName('獲取一組標簽');
3:document.getElementsByClassName('按class名獲取');
4:getByClass
5:document.getElementsByName('按name名獲取');
</script >
(二):變量
1:var name = value;(變量名不可以是數字,不可以使用系統保留名,不可以使用特殊符號);
2:var _this = this;
var $this = this;除外.
(三):函數
1:匿名函數--function(){}
2:命名函數--function show(){} 注:當找不到賦值對象時默認的都是window
(四):流程控制語句幾種形式
1:
if(條件){
執(zhí)行的語句
}else{
執(zhí)行的語句
}
2:
if(條件){
執(zhí)行的語句
}else if(條件){
執(zhí)行的語句
}
3:
if(條件){
執(zhí)行的語句
}else if(條件){
執(zhí)行的語句
}else{
執(zhí)行的語句
}
4:
if(條件){
執(zhí)行的語句
}
5:三目
條件?語句1:語句2;
6:并且
條件 && 語句1;
7:
if(條件)
8:switch判斷
switch(值){
case :
語句
break;
case :
語句
break;
case :
語句
break;
default:
break;
}
(五):循環(huán)
1:
for(初始值,條件,自增){
語句
}
2:
for(var name in json){
語句
}
3:
while(條件){
要重復做的事情
改變條件
}
(六):表單元素和非表單元素的區(qū)別
表單元素的值:用value 獲??；
非表單元素的內容:用 innerHTML 獲取
(七):數據的基本類型
使用 typeof(要測試的數據); 來測試數據類型
1:基本數字類型
number 數字類型 string 字符串類型 boolean（布爾類型 返回 true false） undefin 未定義
2:復合數據類型
object 對象類型
3:function -- 是一個特殊的,既可以是基本類型,也可以是復合型,但會劃分到復合類型里.
類型的前綴：
類型 前綴 類型 實例
對象 o Object oDiv1
數組 a Array aItems
字符串 s String sUserName
整數 i Integer iItemCount
布爾值 b Boolean bIsComplete
浮點數 f Float fPrice
函數 fn Function fnHandler
正則表達式 re RegExp reEmailCheck
變體變量 v Variant vAnything
(八):數據類型的轉換(顯示型轉換或者強制類型轉換)
1:parseInt() 轉整數 2:parseFloat() 轉浮點數 3:Number 轉數字
4:NaN 屬于數字類型,是一個數字類型,NaN和誰都不想等包括自己.(判斷非數字時使用:isNaN());
(九)幾種運算符的分類 （運算符：優(yōu)先級控制要使用小括號 -->())
1:算術運算符：+ - / %
2:賦值運算：= += -= /= = %=
3:比較運算：== < <= > >= != 不等 === 嚴格的比較，是不是相等，先比較類型 !== 嚴格的比較，是不是不相等
4:邏輯運算：與 或 非 || 表示或 只要一個成立，則為真 &&表示并且 全部成立,則為真 !嘆號表示取反
(十):什么是真和假
1:真 true 非空字符串 非零數字 非空對象
2:假 false 空字符串 數字0 null undefined
（2==true ->false 在計算機里是二進制去運行流程,所以當是二的時候為假).
(十一):關于作用域
1:全局 是指在所有的函數以外的變量
2:局部變量 函數內部的變量(window.onload 下的變量是局部變量)
3:閉包 子函數可以使用父函數的變量(在函數上套一層).
(十二):關于js的括號和分號應該什么時候添加?
1:括號 在定時器里不能使用括號 例如{ setInterval(fn,time);
在事件函數里不能使用括號 例如{ oBtn.onclick = fn;}
2:分號 賦值語句要使用分號 執(zhí)行語句結束后要使用分號
(十三):隨機數:Math.random
隨機數的封裝:function rnd(n,m){
return Math.floor(Math.random()(n-m)+m);
}
(十四):返回值: 函數返回值:return 返回值是指返回給調用者,誰調用就返回給誰.能返回什么,只要你愿意什么都可以返回
(十五):eval 是把字符串變成可執(zhí)行的語句 注:具有注入式攻擊
(十六):數組的操作
1）增加 arr.push(數)指放到后面 arr.unshift(數)指放到前面
2）刪除 arr.pop()指刪除后面 arr.shift()指刪除前面
- 刪除第幾個: arr.splice(開始位置，刪除幾個[，元素1，元素2])
- 轉字符串 arr.join(連接的東西)
- 拼接數組 arr. concat(數組的鏈接)
- 數組排序 arr.sort()
- 反轉數組 arr.reverse()
(十七):字符串的操作
1:查找字符串的位置 str.indexOf('字符串') 指找某個東西在字符串中出現的位置,區(qū)分大小寫.
2:查找字符串的位置 str.lastIndexOf(小字符串) 從右往左看，確定一個位置后就不再找,區(qū)分大小寫.
3:字符串截取 str.substring(開始位置,結束位置);
4:切分字符串 str.split(切的方式) 切分的結果：數組
5:大小寫轉換 str.toUpperCase() 把整個字符串轉成大寫
6:大小寫轉換 str.toLowerCase() 把整個字符串轉成小寫
7:charAt()
(十八):Math對象
1:Math.random() 隨機數
2:Math.abs()
3:Math.max()
4:Math.min()
5:Math.pow()
6:Math.sqrt()
7:Math.ceil()
8:Math.floor()
9:Math.round()
(十九):Date對象:
var oDate = new Date(); 時間
1:小時：getHours();
2:分鐘：getMinutes();
3:秒： getSeconds();
4:年： getFullYear()
5:月： getMonth()+1 -- 從0月開始
6:日： getDate()
7:星期：getDay() --- 星期日是 0
8:毫秒: getMilliseconds();
9:時間戳 getTime()
10:setFullYear(年,月,日);
11:setHours(時,分,秒,毫秒);
12:setFullYear(年,月-1);
13:setFullYear(年);
定時器：
*原則：定時器要先清除，再打開
另一個定時器setTimeout
setInterval 一直執(zhí)行，連續(xù)不斷的
setTimeout 只執(zhí)行一次
setTimeout(函數名，時間)
清除：clearTimerout();
(二十):i的問題
1:使用封閉空間()(i):1）解決了變量沖突的問題 2）i值的問題 3)循環(huán)里面加事件，事件里的i不能用
2:自定義屬性
(二十一):數組:1:arr = []; 2:json = {};
(二十二):DOM的操作:
1:獲取元素--obj.tagName();
2:父級獲取子級 children;
3:父級元素的子結點數組 childNodes;
4:首節(jié)點：1) oParent.firstChild 2)oParent.children[0];
兼容寫法: var oFirst = oParent.fristElementChild || oParent.firstChild;
5:尾節(jié)點 1)oParent.lastChild 2)oParent.children[oParent.children.length -1];
兼容寫法: var oLast = oParent.lastElementChild || oParent.lastChild;
6:兄弟節(jié)點：
上一個兄弟節(jié)點：var oPrev = obj.previousElementSibling || obj.previousSibling
下一個兄弟節(jié)點：var oNext = obj.nextElementSibling || obj.nextSibling
7:創(chuàng)建元素： document.createElement('標簽名');動態(tài)創(chuàng)建的元素和原來就存在的元素，沒有任何區(qū)別
8:添加元素：document.body.appendChild(obj);
9:父.appendChild(obj); 表示:添加到父元素的最后面
10:添加前面：父.insertBefore(obj,誰的前面);
11:刪除元素: 父.removeChild(obj);
(二十三):獲取位置
a:獲取可視區(qū)寬高
1:可視區(qū)高度:（寫法）document.documentElement.clientHeight
2:可視區(qū)的寬度：（寫法）document.documentElement.clientWidth
b:獲取盒模型寬高
1:盒模型高度：offsetHeight
2:盒模型寬度：offsetWidth
c:定位父級距離
1:左：obj.offsetLeft
2:上：obj.offstTop
d:絕對位置:getPost
1:getBoundingClientRect().left
2:getBoundingClientRect().top
3:getBoundingClientRect().right
4:getBoundingClientRect().bottom
(二十四):屬性操作：
getAttribute(屬性名) 獲取自定義屬性
setAttribute(屬性名，值) 設置自定義屬性
removeAttribute(屬性名) 刪除屬性
(二十五):事件
1:onclick 點擊事件
2:onmouseover 鼠標移入
3:onmouseout 鼠標移出
4:onmousedown 鼠標按下
5:onmousemove 鼠標移動
6:onmouseup 鼠標抬起
7:onmouseenter 鼠標指針移入對象內時觸發(fā)
8:onmouseleave 鼠標指針移出
9:onmousewheel 鼠標滾輪事件
10:DOMMouseScroll 兼容火狐的滾輪事件寫法
11:oncontextmenu 鼠標右鍵菜單事件
12:ondblclick 鼠標雙擊事件
13:onchange 域的內容發(fā)生改變
14:oninput
15:onblur 失去焦點
16:obj.focus();強制設置焦點：
17:onfocus 獲取焦點
18:obj.blur();強制失去焦點:
19:onkeydown 鍵盤按下時
20:onkeyup 鍵盤抬起
21:onload 載入網頁
22:onerror
23:onresize 窗口縮小
24:onscroll 鼠輪滾動執(zhí)行
滾動條：
高： document.documentElement.scrollTop || document.body.scrollTop
寬：document.documentElement.scrollLeft || document.body.scrollLeft
(二十六)事件對象:ev
var?。铮舦ent = ev || Event;
(二十七)事件流:
obj.addEventListener('click',fn,false);
false 事件冒泡
true 事件捕獲（事件下沉）
只存在高版本瀏覽器上:obj.attachEvent('onclick',fn);
面試題:解釋一下IE事件流和chrome事件流
1:IE 只存在事件冒泡
2:chrome 可以是事件冒泡可以是捕獲（true false）
事件綁定:
1:obj.addEventListener(事件,函數,是否捕獲);
事件：不能帶 on
兼容性： chrome ff ie9+
2:obj.attachEvent(事件,函數);
事件：必須帶on
兼容性：ie 系列
3:處理兼容性：
if(obj.addEventListener){
obj.addEventListener(事件,函數,是否捕獲);
}
else{
obj.attachEvent(事件,函數);
事件解綁：
obj.addEventListener(sEv,fn,false);
removeEventListener(sEv,fn,false)
obj.attachEvent(事件,函數);
obj.detachEvent(事件，函數);
DOMReady();
1:window.onload所有資源加載完才會加載JS
html css img video audio flash.. js
2:DOMReady
html css js
(二十八)cookie:
特性: 1:在服務器環(huán)境下，跟隨服務器發(fā)送
2:大小只有4K大
3:默認會話結束（指關閉瀏覽器時會話結束）
4:name=value 成對出現
5:name不能重復,否則會覆蓋
</script>
