document对象习题 _Web前端

document对象练习

<!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对象练习" onclick="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>

运行结果：

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