Javascript節(jié)點關(guān)系實例分析
更新時間:2015年05月15日 09:14:14 作者:永遠愛好寫程序
這篇文章主要介紹了Javascript節(jié)點關(guān)系,實例分析了javascript操作父子節(jié)點及兄弟節(jié)點的相關(guān)技巧,需要的朋友可以參考下
本文實例分析了Javascript的節(jié)點關(guān)系。分享給大家供大家參考。具體如下:
<html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>節(jié)點關(guān)系</title> <script type="text/javascript"> function Demo() { var divObj = document.getElementById("divDemo"); //獲取父節(jié)點 var parentNode = divObj.parentNode; //displayNodeInfo(parentNode); //獲取子節(jié)點 var childNodes = divObj.childNodes; //子節(jié)點返回的是一個集合,即數(shù)組 //alert(childNodes.length); //顯示節(jié)點個數(shù) //displayNodeInfo(childNodes[0]); //獲取兄弟節(jié)點 //----------獲取上一個兄弟節(jié)點 var preBrotherNode = divObj.previousSibling.previousSibling; //標簽之間存在空行時,會出現(xiàn)一個空白的文本節(jié)點,在獲取節(jié)點時,一定要注意。 //displayNodeInfo(preBrotherNode); //----------獲取下一個兄弟節(jié)點 var nextBrotherNode = divObj.nextSibling; displayNodeInfo(nextBrotherNode); } function displayNodeInfo(node) { alert("Name:" + node.nodeName + ",Type:" + node.nodeType + ",Value:" + node.nodeValue); } </script> </head> <body> <input type="button" value="測試" onclick="Demo()" /> <div id="divDemo">div內(nèi)容</div> <table> <tr> <td>單元格1</td> <td>單元格2</td> </tr> <tr> <td>單元格3</td> <td>單元格4</td> </tr> </table> </body> </html>
希望本文所述對大家的javascript程序設(shè)計有所幫助。
您可能感興趣的文章:
- javascript將DOM節(jié)點添加到文檔的方法實例分析
- JavaScript實現(xiàn)獲得所有兄弟節(jié)點的方法
- 刪除javascript所創(chuàng)建子節(jié)點的方法
- JavaScript針對網(wǎng)頁節(jié)點的增刪改查用法實例
- javascript動態(tài)修改Li節(jié)點值的方法
- javascript刪除一個html元素節(jié)點的方法
- javascript獲取dom的下一個節(jié)點方法
- 用javascript讀取xml文件讀取節(jié)點數(shù)據(jù)
- javascript 獲取HTML DOM父、子、臨近節(jié)點
- JavaScript節(jié)點及列表操作實例小結(jié)
相關(guān)文章
javascript 中null和undefined區(qū)分和比較
這篇文章主要介紹了javascript 中null和undefined區(qū)分和比較的相關(guān)資料,需要的朋友可以參考下2017-04-04JavaScript 禁止用戶保存圖片的實現(xiàn)代碼
這篇文章主要介紹了JavaScript 禁止用戶保存圖片的實現(xiàn)代碼,本文通過實例代碼給大家介紹的非常詳細,對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友可以參考下2020-04-04self.attachevent is not a function的解決方法
今天一個客戶用chrome瀏覽器訪問網(wǎng)站,他的網(wǎng)站js提示self.attachevent is not a function,這個問題就是這個瀏覽器不支持attachevent,可以通過如下方法解決了,分享一下,需要的朋友可以參考下2017-04-04教你用js截取字符串開頭、結(jié)尾及兩字符串之間的內(nèi)容
在js中可以通過indexOf()方法找到指定的字符位置,再使用length屬性獲得字符串的長度,下面這篇文章主要給大家介紹了關(guān)于如何用js截取字符串開頭、結(jié)尾及兩字符串之間的內(nèi)容的相關(guān)資料,需要的朋友可以參考下2022-11-11