<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<style>
div {
width: 300px;
height: 400px;
border: 1px solid red;
}
</style>
</head>
<body>
<input type="button" value="显示效果" id="bt"/>
<div id="dv">
<span>我是span</span>
<p>我是p</p>
<span>我是span</span>
<p>我是p</p>
<span>我是span</span>
<p>我是p</p>
<span>我是span</span>
<p>我是p</p>
<span>我是span</span>
<a href="http://www.baidu.com">百度</a>
</div>
<script src="common.js"></script>
<script>
my$("bt").onclick = function () {
//先获取div
var dvObj = document.getElementById("dv");
//获取里面的所有子节点
var nodes = dvObj.childNodes;
//循环遍历所有的子节点
for(var i = 0; i < nodes.length; i++) {
//判断这个子节点是不是p标签
if(nodes[i].nodeType == 1 && nodes[i].nodeName == "P") {
nodes[i].style.backgroundColor = "red";
}
}
};
</script>
</body>
</html>
