一文秒懂JavaScript DOM操作基礎
阿新 • • 發佈：2021-05-04
DOM概念
DXOJJIOM：document object model : 文件物件模型
通過js去操作HTML的程式碼，新增元素，刪除元素。。。
獲取元素
（1）getElementById 通過id獲取，獲取到的是一個元素
（2）getElementsByTagName 通過標籤名獲取，獲取到的是一個元素集合（陣列）
（3）getElementsByClassName 通過class獲取，獲取到的是一個元素集合（陣列）
（4）getElementsByNam程式設計客棧e 通過name屬性獲取，獲取到的是一個元素集合（陣列）
總結：獲取元素可以根據標籤名、id、class、name屬性來獲取。Id獲取的結果是一個 元素，而其他獲取的是一個集合。
getElementsByTagName和getElementsByClassName
修改元素
（1）修改內容
通過innerText屬性讀取或設定標籤內部的文字
可以用innerHTML屬性讀取或設定標籤內部的文字
兩個區別：innerHTML會按照HTML的規則解析文字，而innerText只是當作普通的文字 內容。
（2）修改樣式
a：xxx.style.yyy
b：xxx.classname = “……”（相當於修改了class屬性）
新增刪除元素
（1）createElement 建立一個元素節點
createElement（“p”）建立一個段落
createTexhttp://www.cppcns.comtNode(“文字內容”)建立一個值為“文字內容”的文字節點
（3）appendChild 新增子節點
（4）removeChild 刪除子節點
導航
Document：根節點
parentNode： 獲取父節點
childNodes： 獲取所有的子節點
firstChild：第一個子節點
lastChild：最後一個子節點
到此這篇關於javascript DOM操作基礎的文章就介紹到這了,更多相關javaScript DOM基礎內容請搜尋我們以前的文章或繼續瀏覽下面的相關文章希望大家以後多多支援我們！