<div id='nav' class='nav'><ul><li>首页</li></ul></div>
使用.nav ul li{background:url(../img/bg.jgp);}定义之后
这个样式.nav_ul_li_1{background:url(../img/bg1.jpg);}}
将不能通过document.getElementById('nav').className = 'nav_ul_li_1';
来改变背景与背景颜色。
解决办法就是不用通用的方法,即ul li{}这种方法定义background:();
更正一下,应该是这样:
<div class='nav'><ul><li id='nav'>首页</li></ul></div>
谢谢这个朋友,用style.backgroundImage确实或者实现,但是用className却不行。
代码如下:
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>css与javascript的一个冲突</title>
<style type="text/css">
.nav ul li{background:url(bg.jpg) no-repeat 5px 5px;width:100px;height:30px;float:left;}
</style>
<script type="text/javascript">
function f(obj){
obj.style.backgroundImage = 'url(bg1.jpg)';
}
</script>
</head>
<body>
<div class='nav'>
<ul>
<li onmouseover='f(this);'>首页</li>
<li>联系我们</li>
</ul>
</div>
</body>
</html>
<head>
<title>css与javascript的一个冲突</title>
<style type="text/css">
.nav ul li{background:url(bg.jpg) no-repeat 5px 5px;width:100px;height:30px;float:left;}
</style>
<script type="text/javascript">
function f(obj){
obj.style.backgroundImage = 'url(bg1.jpg)';
}
</script>
</head>
<body>
<div class='nav'>
<ul>
<li onmouseover='f(this);'>首页</li>
<li>联系我们</li>
</ul>
</div>
</body>
</html>