更新時間:2022-06-09 來源:黑馬程序員 瀏覽量:
DOM對象本質(zhì)上是瀏覽器根據(jù)html標(biāo)簽生成的 JS對象,它的所有的標(biāo)簽屬性都可以在這個
JS對象上面找到,修改這個對象的屬性會自動映射到標(biāo)簽身上。DOM的核心思想是把網(wǎng)頁內(nèi)容當(dāng)做對象來處理。其中document 對象是DOM
里提供的一個對象,所以它提供的屬性和方法都是用來訪問和操作網(wǎng)頁內(nèi)容的,網(wǎng)頁中所有的內(nèi)容在document里面。document與其他網(wǎng)頁中各個節(jié)點元素關(guān)系如下:
將 HTML 文檔以樹狀結(jié)構(gòu)直觀的表現(xiàn)出來,我們稱之為文檔樹或 DOM 樹。文檔樹模型直觀的體現(xiàn)了標(biāo)簽與標(biāo)簽之間的關(guān)系。
獲取DOM對象
1. 根據(jù)CSS選擇器來獲取DOM元素
(1)匹配單個元素一個元素
這里選擇的語法如下:
document.querySelector('css選擇器')
參數(shù)包含一個或多個有效的CSS選擇器 字符串,返回值CSS選擇器匹配的第一個元素,一個 HTMLElement對象。如果沒有匹配到,則返回null。
(2)選擇匹配的多個元素
語法如下:
document.querySelectorAll('ul li')
參數(shù)包含一個或多個有效的CSS選擇器 字符串,返回值CSS選擇器匹配的NodeList 對象集合,例如:
document.querySelectorAll('ul li')
document.querySelectorAl1('css選擇器')
得到的是一個偽數(shù)組: 有長度有索引號的數(shù)組,但是沒有 pop() push() 等數(shù)組方法,想要得到里面的每一個對象,則需要遍歷(for)的方式獲得。
注意:哪怕只有一個元素,通過querySelectAll() 獲取過來的也是一個偽數(shù)組,里面只有一個元素而已
【AI設(shè)計】北京143期畢業(yè)僅36天,全員拿下高薪offer!黑馬AI設(shè)計連續(xù)6期100%高薪就業(yè)
2025-09-19【跨境電商運營】深圳跨境電商運營畢業(yè)22個工作日,就業(yè)率91%+,最高薪資達(dá)13500元
2025-09-19【AI運維】鄭州運維1期就業(yè)班,畢業(yè)14個工作日,班級93%同學(xué)已拿到Offer, 一線均薪資 1W+
2025-09-19【AI鴻蒙開發(fā)】上海校區(qū)AI鴻蒙開發(fā)4期5期,距離畢業(yè)21天,就業(yè)率91%,平均薪資14046元
2025-09-19【AI大模型開發(fā)-Python】畢業(yè)33個工作日,就業(yè)率已達(dá)到94.55%,班均薪資20763元
2025-09-19【AI智能應(yīng)用開發(fā)-Java】畢業(yè)當(dāng)天offer率91%,薪資1W+占比54.2%,班級均薪12k+
2025-09-19