1. 獲取元素方法
1.根據 id
var element = document.getElementById("idName");
2.根據 標籤名
var elements = document.getElementsByTagName("標籤名");
3.根據 類名
var elements = document.getElementsByClassName("類名");
4.H5新增 獲取方法
document.queryselector("");
document.queryselectorAll("");
5.獲取 body 元素
document.body
2. 事件
1.點擊事件(雙擊事件ondblclick)
ele.onclick = function(){};
2.鼠標事件
1.鼠標懸浮(通過) ele.onmouseover = function(){};
2.鼠標離開 ele.onmouseout = function(){};
onmouseenter和onmouseleave是DOM2的方法, 有兼容問題
onmouseover 鼠標通過盒子的時候執行1次
onmousemove 鼠標只要移動的時候就會執行
3.鼠標按下 ele.onmousedown = function(){};
4.鼠標彈起 ele.onmouseup = function(){};
5.鼠標滾動 ele.onmousewheel = function(){};
3.焦點事件
1.失去焦點 ele.onblur = function(){};
2.得到焦點 ele.onfocus = function(){};
3.輸入事件 ele.oninput = function(){};
onkeyup和oninput 聯想搜索
4.內容發生改變 ele.onchange = function(){};
通常作驗證或者下拉框選擇會使用onchange
4.鍵盤事件
1.鍵盤鍵入 ele.onkeydown = function(){};
2.鍵盤彈起 ele.onkeyup = function(){};
3.鍵盤按下 ele.onleypress = function(){};
onkeydown優先於onkeypress執行
onkeypress不識別系統按鍵
onkeypress區分大小寫
5.window 事件
1.鍵盤事件 event.keyCode
鍵盤對應的編碼
2.頁面滾動 window.onscroll = function(){};
window.scroll必須有滾動條才觸發, 通常配合$(window).scrollTop()
window.onmousewheel / document.onmousewheel不管有沒有滾動條都能觸發
3.窗口大小變化 window.onresize = function(){};
3. 字符串 相關方法
1.replace() 字符串替換
xxx = xxx.replace(searchValue, replaceValue);
只找第一個匹配的替換
2.indexOf() --- lastIndexOf() 搜索(找到 對應的 返回位置)
一個參數從第一個找
兩個參數從指定的位置找
不存在返回 -1, 查找的是""返回 0
3.trim() 刪除左右空格
4.split("") 字符串 轉換成 數組 引號裏肯定用什麼分割
5.charAt() 獲取指定位置處字符
6.slice() 從start位置開始,截取到end位置,end取不到
7.substring() 從start位置開始,截取到end位置,end取不到
8.substr() 從start位置開始,截取length個字符
9.toUpperCase() str轉換爲大寫
10.toLowerCase() str轉換爲小寫
4.數組 相關方法
1.join("") 數組 轉換成 字符串 引號裏肯定用什麼拼接(默認逗號)
2.toString() 數組 轉換爲 字符串 (去掉[])
3.valueOf() 返回數組對象自己
4.Array.isArray(xxx) 檢測xxx是不是數組
5.xxx instanceOf Array 檢測xxx是不是數組
6.push() pop() 從後邊增刪
7.unshift() shift() 從前邊增刪
8.reverse() 翻轉數組
9.slice() 從數組中截取一部份內容
10.splice() 從數組中刪除或替換數組中的一部分
11. xxx.indexOf() 尋找指定元素在數組中的位置,若是沒找到返回-1
12. xxx.lastIndexOf() 從後面找
13.xxx.filter(function(){ }) 迭代過濾/篩選
14.xxx.forEach(function(){ }) 遍歷
15.xxx.map(function(){ }) 映射
16.xxx.some(function(){ }) 數組中至少有一個數據符合要求
17.xxx.every(function(){ }) 數組中全部數據符合要求
18.concat() 把一個數組和另外一個數組拼接在一塊兒
19.sort() 進行冒泡排序 b-a倒序 a-b升序數組