跟着视频敲的,视频里的能实现,我的不行,有onclick事件,但是背景色不变<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>点击设置p标签背景色</title>
<style>
div {
width: 200px;
height: 400px;
border: 1px solid red;
}
</style>
</head>
<body>
<input type="button" value="变色" id="btn">
<div id="dv">
<br>
<span>这是一个span</span>
<p>这是一个p</p>
<span>这是一个span</span>
<p>这是一个p</p>
<span>这是一个span</span>
<p>这是一个p</p>
<a href="www.bing.com">这是一个a</a>
</div>
<script src="../common.js"></script>
<script>
my$("btn").onclick = function () {
//获取div
var dvObj = my$("dv");
//console.log(dvObj);
//获取div下所有的子节点
var nodes = dvObj.childNodes;
console.log(nodes.length);
//循环遍历所有的子节点
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>在敲nodes.length的时候webstrom提示的length是被划掉的,是不能用length嘛
1 回答
已采纳
聪明的汤姆
TA贡献112条经验 获得超33个赞
if判断条件中，把p改为大写，因为你获取的nodeName都是大写的
if (nodes[i].nodeType == 1 && nodes[i].nodeName == "P")
或者转小写再判断
if (nodes[i].nodeType == 1 && nodes[i].nodeName.toLowerCase() == "p")
望采纳!
ps：遇到什么问题，自己先在浏览器调试，比如这里你可以在for里面输出所有子节点的nodeType和nodeName
添加回答
举报
0/150
提交
取消