js中Dom的學習

dom(document object model) 即文件物件模型，意思是html文件中每乙個元素都是乙個物件節點。

需要注意的是 getelementbyid獲得到的是單個節點，而其他方法獲得到的是乙個集合（哪怕最終取到的只有乙個元素），從語義上也能看出來。

簡單演示

//獲取id為first的元素節點

var fisrt = document.
getelementbyid
("first");
//元素型別
console.
log(first.nodetype)
;//元素名
console.
log(fisrt.nodename)
;//元素值
console.
log(fisrt.nodevalue)
;

"first"

>
文字內容
name
="second"
>
p>
div>

說明標籤元素沒有節點值

var second = document.

getelementsbytagname
("p");
console.
log(second)
;

var fisrt = document.

getelementbyid
("first");
var third = fisrt.childnodes;
console.
log(third)
for(
var i=
0;i<=third.length;i++
)

注意：在dom中，乙個回車也會被算作是乙個文字元素。

var one = document.

getelementbyid
("div");
var two = one.firstchild;
console.
log(
"two："
+two.nodename)
;var three = one.lastchild;
console.
log(
"three："
+three.nodename)
;var four = two.parentnode;
console.
log(
"four:"
+four.nodename)
;var five = two.nextsibling;
console.
log(
"five:"
+five.nodename)
;var six = three.previoussibling;
if(six===five)

"div"

>
>
p>
href="
">
a>
>
span
>
div>

JS中的DOM事件

1.html事件處理程式 html事件缺點 html和js 緊密的耦合在一起，js 個html都需要進行修改。2.dom0級事件處理程式 較傳統的方式 把乙個函式賦值給乙個事件的處理程式屬性用的比較多的方法，簡單，跨瀏覽器的優勢 沒有html事件處理程式的缺點。3.dom2級事件處理程式 dom2級...

JS中的DOM物件

主要是操作html 內容 dom document object model w3c api標準 是w3c組織推薦的處理可擴充套件置標語言的標準程式設計介面。它是一種與平台和語言無關的應用程式介面 api 它可以動態地訪問程式和指令碼,更新其內容 結構和www文件的風格 目前,html和xml文件是...

JS學習筆記 DOM

什麼是dom?文件物件模型 dom 是html和xml文件的程式設計介面。它提供了對文件的結構化的表述，並定義了一種方式可以使從程式中對該結構進行訪問，從而改變文件的結構，樣式和內容。dom 將文件解析為乙個由節點和物件 包含屬性和方法的物件 組成的結構集合。簡言之，它會將web頁面和指令碼或程式語...