- 選擇符API
- querySelector()方法
接收一個(gè)css選擇符码党,返回與該模式匹配的第一個(gè)元素抚吠;通過(guò)Element類型調(diào)用querySelector()方法常潮,只會(huì)在該元素后代范圍內(nèi)查找匹配的元素 - querySelectorAll()方法
返回所有匹配的元素 - matchesSelector()方法
接受一個(gè)參數(shù),調(diào)用的元素與選擇符匹配楷力,返回true喊式,否則返回false
- 元素遍歷
childElementCount//返回子元素個(gè)數(shù)
firstElementChild//指向第一個(gè)元素
lastElementChild//指向最后一個(gè)子元素
previousElementSibling//指向前一個(gè)同輩元素
nextElementSibling//指向后一個(gè)同輩元素
- HTML5
(1)與類相關(guān)的擴(kuò)充
- getElementsByClassName()方法
- classList屬性
add(value)//將給定的字符串列表添加到列表中
contains(value)//列表中是否存在給定的值孵户,返回布爾值
remove(value)//從列表中刪除給定字符串
toggle(value)//列表中由則刪除,沒(méi)有則添加
(2) 焦點(diǎn)管理
document.activeElement屬性會(huì)引用DOM中當(dāng)前獲得了焦點(diǎn)的元素
document.hasFocus()//用于確定文檔是否獲得了焦點(diǎn)
(3) HTMLDocument的變化
- readyState 屬性
作為文檔是否加載完成的指示器
值為loading 正在加載
值為complete 加載完成 - 兼容模式
瀏覽器采用哪種渲染模式
document.compatMode
值為CSS1Compat標(biāo)準(zhǔn)模式
值為BackCompat混雜模式
- head屬性
引用文檔<head>元素
(4)字符集屬性
charset
(5) 自定義數(shù)據(jù)屬性
為元素提供與渲染無(wú)關(guān)的信息或者提供語(yǔ)義信息岔留,以data-作為前綴
<div data-myname="Neil"></div>//定義
document.dataset.myname
(6)插入標(biāo)記
innerHTM屬性返回并調(diào)用元素的所有子節(jié)點(diǎn)(包括元素夏哭、注釋和文本節(jié)點(diǎn))對(duì)應(yīng)的html標(biāo)記
outerHTML屬性返回并調(diào)用該元素及所有子節(jié)點(diǎn)的html標(biāo)簽
insertAdjacentHTML()方法,兩個(gè)參數(shù)献联,插入位置和要插入的html文本
第一個(gè)參數(shù)為:
beforebegin:在當(dāng)前元素之前插入一個(gè)緊鄰的同輩元素
afterbegin:在當(dāng)前元素之下插入一個(gè)新的子元素或者在第一個(gè)子元素之前再插入新的子元素
beforeend:在當(dāng)前元素之下插入一個(gè)新的子元素或者在最后一個(gè)子元素之后再插入新的子元素
afterend:在當(dāng)前元素之后插入一個(gè)緊鄰的同輩元素
(7) scrollIntoView()方法
通過(guò)滾動(dòng)瀏覽器窗口或者某個(gè)容器元素方庭,調(diào)用元素會(huì)出現(xiàn)在視圖