dom節點常用方法介紹01
1.查詢元素節點
1.1getelementbyid()
尋找乙個有著給定 id 屬性值的元素，返回值是乙個有著給定id屬性值的元素節點。如果不存在這樣的元素，它返回null.
var oelement = document.getelementbyid ( sid )
該方法只能用於document物件
例子:
1.3getelementsbytagname()
尋找有著給定標籤名的所有元素，這個方法將返回乙個節點集合，這個集合可以當作乙個陣列來處理。這個集合的 length 屬性等於當前文件裡有著給定標籤名的所有元素的總個數。
var elements = document.getelementsbytagname(tagname);
var elements = element.getelementsbytagname(tagname);
該方法不必非得用在整個文件上。它也可以用來在某個特定元素的子節點當中尋找有著給定標籤名的元素。
var container = document.getelementbyid(「sid」);
var elements = container.getelementsbytagname(「p」);
alert(elements .length);
例子:
博士^^^^^
碩士^^^^^
本科^^^^^
幼兒園^^^^^
美容^^^^^
it^^^^^
程式設計師^^^^^
建築師^^^^^
2.檢視是否存在子節點
haschildnodes()
該方法用來檢查乙個元素是否有子節點，返回值是 true 或 false.
var booleanvalue = element.haschildnodes();
文字節點和屬性節點不可能再包含任何子節點，所以對這兩類節點使用 haschildnodes 方法的返回值永遠是 false.
如果 haschildnodes 方法的返回值是 false，則 childnodes,firstchild,lastchild 將是空陣列和空字串。
例子:
博士^^^^^
碩士^^^^^
本科^^^^^
幼兒園^^^^^
3.dom 屬性
3.1nodename
文件裡的每個節點都有以下屬性。
nodename:乙個字串，其內容是給定節點的名字。
var name = node.nodename;
* 如果節點是元素節點，nodename返回這個元素的名稱
* 如果是屬性節點，nodename返回這個屬性的名稱
* 如果是文字節點，nodename返回乙個內容為#text 的字串
注:nodename 是乙個唯讀屬性。
3.2nodetype
返回乙個整數，這個數值代表著給定節點的型別。
nodetype 屬性返回的整數值對應著 12 種節點型別,常用的有三種：
node.element_node ---1 -- 元素節點
node.attribute_node ---2 -- 屬性節點
node.text_node ---3 -- 文字節點
nodetype 是個唯讀屬性
3.3nodevalue
返回給定節點的當前值（字串）
如果給定節點是乙個屬性節點，返回值是這個屬性的值。
如果給定節點是乙個文字節點，返回值是這個文字節點的內容。
如果給定節點是乙個元素節點，返回值是 null
nodevalue 是乙個 讀/寫 屬性，但不能對元素節點的 nodevalue 屬性設定值，
但可以為文字節點的 nodevalue 屬性設定乙個值。
var li = document.getelementbyid(「li」);
if(li.firstchild.nodetype == 3)
li.firstchild.nodevalue = 「你好」;
例子:
明天上課
練習1:
問題:
列印出 id=「bj」 該節點的所有子節點的(nodename, nodetype, nodevalue)
同時列印文字值 北京 海淀 奧運 解:
練習2:
博士^^^^^
碩士^^^^^
本科^^^^^
幼兒園^^^^^
問題:
輸出所有select元素下的所有option元素中對應的文字內容
例如:中專^^ 輸出--->中專^^ 解:
博士^^^^^
碩士^^^^^
本科^^^^^
幼兒園^^^^^
javascript DOM 獲取節點
1.獲取元素節點 1.1 通過元素節點的id屬性獲取 語法 document.getelementbyid 元素id屬性的值 例如 1.2 根據元素的名稱獲取,獲取的是所有為該名稱的元素節點組成的陣列，可以用陣列的方法操作該節點陣列 語法 document.getelementsbytagname ...
javascript DOM節點 元素
子級 父級.children 一組元素 父級 子級.parentnode this 兄弟節點 下乙個兄弟節點相容 obj.nextelementsibling obj.nextsibling 上乙個兄弟節點 var opre obj.previouselementsibling obj.previo...
JavaScript DOM節點操作總結
節點型別主要有三種 元素節點，屬性節點和文字節點。而對dom的主要也就是圍繞元素節點和屬性節點的增刪改查。下面就分別從對元素節點的操作和對屬性節點的操作來介紹。在對dom進行增刪改之前，首先要找到對應的元素。具體的查詢方法如下 getelementbyid 得到單個節點 getelementsbyt...