js更改样式代码，为什么点击后没有任何效果出现？？？问题在哪啊
<!DOCTYPEhtml><html><style>#div{width:100px;background:red;}#yy{width:250px;backgroun...
<!DOCTYPE html>
<html>
<style>
#div {width:100px;background:red;}
#yy {width:250px;background:blue;}
</style>
<body>
<div id="div">I am a div.</div>
<p>
<button type="button" onclick="myFunction()">点击这里</button>
</p>
<script>
function myFunction()
{
document.getElementById("div").className="yy";
}
</script>
</body>
</html> 展开
<html>
<style>
#div {width:100px;background:red;}
#yy {width:250px;background:blue;}
</style>
<body>
<div id="div">I am a div.</div>
<p>
<button type="button" onclick="myFunction()">点击这里</button>
</p>
<script>
function myFunction()
{
document.getElementById("div").className="yy";
}
</script>
</body>
</html> 展开
展开全部
首先,没有定义
.yy{}然后,#div{}可以覆盖class,
在style中添加
.yy{color:#fff;background:blue;}试一下就明白了
追问
仔细看可以了，但为什么背景色不能改变？？？？？？？
追答
#div{}(id)覆盖了.yy{}(class),(#打头 就是比 . 打头 优先级高)=.=
这是样式的优先级问题.
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
