JS文件物件模型 DOM 的基本方法

2021-05-01 02:57:05 字數 1439 閱讀 8595

一.直接引用結點

1.document.getelementbyid(id);

--在文件裡面通過id來找結點

2.document.getelementbytagname(tagname);

--返回乙個陣列,包含對這些結點的引用

--如:document.getelementbytagname("span");將返回所有型別為span的結點

二.間接引用結點

3.element.childnodes

--返回element的所有子結點,可以用element.childnodes[i]的方式來呼叫

--element.firstchild=element.childnodes[0];

--element.lastchild=element.childnodes[element.childnonts.length-1];

4.element.parentnode

--引用父結點

5.element.nextsibling; //引用下乙個兄弟結點

element.previoussibling; //引用上乙個兄弟結點

三.獲得結點資訊

6.nodename屬性獲得結點名稱

--對於元素結點返回的是標記名稱,如:返回的是"a"

--對於屬性結點返回的是屬性名稱,如:class="test" 返回的是test

--對於文字結點返回的是文字的內容

7.nodetype返回結點的型別

--元素結點返回1

--屬性結點返回2

--文字結點返回3

8.nodevalue返回結點的值

--元素結點返回null

--屬性結點返回undefined

--文字結點返回文字內容

9.haschildnodes()判斷是否有子結點

10.tagname屬性返回元素的標記名稱

--這個屬性只有元素結點才有,等同於元素結點的nodename屬性

四.處理屬性結點

11.每個屬性結點都是元素結點的乙個屬性,可以通過(元素結點.屬性名稱)訪問

12.利用setattribute()方法給元素結點新增屬性

--elementnode.setattribute(attributename,attributevalue);

--attributename為屬性的名稱,attributevalue為屬性的值

13.使用getattribute()方法獲得屬性值

--elementnode.getattribute(attributename);

五.處理文字結點

14.innerhtml和innertext屬性,這兩個方法相信大家都很熟悉,不介紹了,值得注意的是無論是ie還是firefox都容易把空格、換行、製表符等當成文字結點。所有一般通過element.childnodes[i]引用文字結點的時候,一般要處理:

js文件物件模型DOM

1 textarea select input必須同時有id和name 2 每個節點都有兩個屬性 nodename和nodetype 但只有文字節點才會有nodue值 var p document.getelementbyidx x pnode 父節點 p.parentnode 子節點的陣列集合 p...

DOM 文件物件模型

dom 文件物件模型 概念的推出,這個api使html如虎添翼,但是有些學dhtml的朋友還是有些困撓,只是因為目前的手冊的書寫不太科學,是按字母 來分的,不便查閱.其實dom中最關鍵是要掌握節點與節點之間的關係 between node andnode 想學習dhtml中的dom千萬不要從頭到尾地...

DOM文件物件模型

dom document object model文件物件模型 用來將標記型文件的文件封裝成物件,並且將文件中的所有的類容 文字,屬性,屬性值 分裝成為物件。封裝的目的是為了更好的對文字文件進行操作。有了物件就可以更好的利用文件對其中的屬性和值進行呼叫。document 標記型文件 object 封...