<input type="button" value="变色" id="btn" />
<div id="dv">
<span>111</span>
<p>22222</p>
<span>333333</span>
<p>44444444444444444</p>
<span>555555555555555</span>
<a href="#">66666666666</a>
</div>
<script>
function mm(id){
return document.getElementById(id);
}
mm("btn").onclick=function (){
//点击按钮设置p变色
var divobj=mm("dv");
var nodes=divobj.childNodes;
if(document.querySelector("P")!=null){
var all = document.querySelectorAll("P")
all.forEach(function(data , k){
data.style.backgroundColor="red";
})
}
//
// }
// alert(nodes)
// for (var i = 0; i < nodes.length; i++) {
//
//
//
// //判断子节点是不是p标签
// console.log(nodes[i]);
//
// /*if(nodes[i].nodeType==1&&nodes[i].nodeName=="p"){
// alert(2)
// nodes[i].style.backgroundColor="red";
//
// }*/
//
// }
}
</script>
</body>
通过节点操作元素背景色
最新推荐文章于 2020-09-27 13:00:11 发布