1.
<html>
<head>
<title>dom</title>
<script>
function searchDom()
{
var oLi = document.getElementsByTagName("li");
alert(oLi.length+" "+oLi[0].tagName+" "+oLi[3].childNodes[0].nodeValue);
var oUl = document.getElementsByTagName("ul");
var oLi2 = oUl[1].getElementsByTagName("li");
alert(oLi2.length+" "+oLi2[0].tagName+" "+oLi2[1].childNodes[0].nodeValue);
}
</script>
</head>
<body οnlοad="searchDom()">
<ul>客户端语言
<li>HTML</li>
<li>JS</li>
<li>CSS</li>
</ul>
<ul>服务器端语言
<li>ASP</li>
<li>JSP</li>
<li>PHP</li>
</ul>
</body>
</html>
上面代码结果为6 LI ASP
3 LI JSP
2.判断是否有子节点可以使用
oLi.hasChildNodes()
3.根据dom对象获取属性,oLi.getAttribute("title");
4.创建新节点
var op = document.createElement("p");
var text = document.createTextNode("我是中国人");
op.appendChild(text);
document.body.append(op);
5.innerHTML的使用
var myDiv = document.getElementById("aaa");
myDiv.innerHTML会输出所有该节点下的内容,包括代码标签
也可以直接进行写操作,比如:myDiv.innerHTML = "<img src="11.jpg"/>";