document对象练习

喜欢ヅ旅行 2022-05-14 01:12 142阅读 0赞

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>无标题文档</title>
    
    <script type="text/javascript">
    function getAllNodes()
    {
    	if(confirm("你真的要遍历所有节点吗"))
    	{
    		getNodes(document, 0);
    		var winObj = open("", "_blank");
    		winObj.document.write(info);
    	}
    }
    var info = "";
    function getNodes(node, level)
    {
    	info += getLevel(level)+node.nodeName+"::"+node.nodeType+"::"+node.nodeValue+"<br/>";
    	var arr = node.childNodes;
    	
    	level++;
    	for(var x = 0; x < arr.length; x++)
    	{
    		if(arr[x].hasChildNodes())
    			getNodes(arr[x], level);
    		else
    			info += getLevel(level)+arr[x].nodeName+"::"+arr[x].nodeType+"::"+arr[x].nodeValue+"<br/>";
    	}
    }
    function getLevel(level)
    {
    	var s = "";
    	for(var x = 0; x < level; x++)
    	{
    		s+="|--";
    	}
    	return s;
    }
    </script>
    
    </head>
    
    <body>
    <input type="button" value="document对象练习" οnclick="getAllNodes()" />
    <div>
    这是一个div区域
    </div>
    <table id="tabid">
    	<tr>
    		<td>单元格一</td>
    		<td>单元格二</td>
    	</tr>
    	<tr>
    		<td>单元格一</td>
    		<td>单元格二</td>
    	</tr>
    </table>
    
    <a href="http://www.baidu.com">百度</a>
    
    <span>span区域</span>
    
    </body>
    </html>

运行结果：

![1353852760_7839.jpg][]

![1353852770_9165.jpg][]

上机感言：写java和C++写习惯了，遇到变量就想用那些基本类型，结果在循环中写了一个int x=0；导致程序直接运行不出来，郁闷死我了，弄了一个晚上，终于发现了，迅速的把int改成了var，程序运行出来了，一定要注意啊，不要再犯这样的错误，这种错误很难找

[1353852760_7839.jpg]: https://img-my.csdn.net/uploads/201211/25/1353852760_7839.jpg
[1353852770_9165.jpg]: https://img-my.csdn.net/uploads/201211/25/1353852770_9165.jpg