Javascript遞歸打印Document層次關系實例分析
更新時間：2015年05月15日 09:23:55 作者：永遠愛好寫程序
這篇文章主要介紹了Javascript遞歸打印Document層次關系的方法,實例分析了javascript中Document的層次關系,需要的朋友可以參考下
本文實例講述了Javascript遞歸打印Document層次關系的方法。分享給大家供大家參考。具體如下：
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>遞歸顯示節(jié)點層次關系</title>
<script type="text/javascript">
var ResultStr = "";
function ListNode(node,level) {
PrintInfo(node, level);
level++;
var nodes = node.childNodes;
for (var i = 0; i < nodes.length; i++) {
if (nodes[i].hasChildNodes()) {
ListNode(nodes[i], level); //遞歸
}
else {
PrintInfo(nodes[i], level);
}
}
}
function getSpace(level) {
var s = "";
for (var i = 0; i < level; i++) {
s+="!----"
}
return s;
}
function PrintInfo(node, level) {
ResultStr += getSpace(level) + "Name:" + node.nodeName +
"...Type:" + node.nodeType + "...Value:" + node.nodeValue + "<br />";
}
function getDocAllInfo() {
ResultStr = "";
ListNode(document, 0);
document.write(ResultStr);
}
</script>
</head>
<body>
<input type="button" value="測試" onclick="getDocAllInfo()" />
<div id="divDemo">div內容</div>
<table>
<tr>
<td>單元格1</td>
<td>單元格2</td>
</tr>
<tr>
<td>單元格3</td>
<td>單元格4</td>
</tr>
</table>
<input type="text" />
<span>我是SPAN</span>
<!--我是注釋-->
</body>
</html>
希望本文所述對大家的javascript程序設計有所幫助。
相關文章
這篇文章主要介紹了深入理解 webpack 文件打包機制(小結)，小編覺得挺不錯的，現在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-01-01
十分鐘打造山寨版谷歌AutoComplete，因為是十分鐘打造出來的，所以只考慮表面效果，其他全部忽略，絕對的山寨。2009-12-12
下面小編就為大家分享一篇JS計算距當前時間的時間差實例，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2017-12-12
這篇文章主要介紹了微信小程序實現動態(tài)顯示和隱藏某個控件功能,涉及微信小程序事件響應及樣式動態(tài)操作相關實現技巧,需要的朋友可以參考下2018-12-12
JavaScript中的Window.open()用法示例詳解
這篇文章主要給大家介紹了關于JavaScript中Window.open()用法的相關資料,今天在項目中用到了彈出子窗口,就想到了用JavaScript實現的兩種方法,其中一個就是window.open(),需要的朋友可以參考下2023-07-07
這篇文章主要給大家介紹了利用JavaScript實現事件的中斷傳播和行為阻止的方法示例，文中給出了詳細的介紹和示例代碼，相信對大家的理解和學習具有一定的參考借鑒價值，需要的朋友們下面來一起看看吧。2017-01-01
JavaScript中輸出信息的方法(信息確認框-提示輸入框-文檔流輸出)
這篇文章主要介紹了JavaScript中輸出信息的方法(信息確認框-提示輸入框-文檔流輸出)的相關資料,需要的朋友可以參考下2016-06-06
這篇文章主要為大家介紹了JS前端認證授權技巧歸納總結，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2023-03-03
這篇文章主要為大家詳細介紹了微信小程序實現列表項左滑刪除效果，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-08-08
Maps Javascript...2007-01-01