通过javascript更改html元素属性不会更改外观
我有一个html页面,带有导航栏。理想情况下,一旦用户选择了一个选项,该选项背景图像就会改变。但是,我无法通过使用javascript动态更改list属性来实现这一点 html:通过javascript更改html元素属性不会更改外观,javascript,html,css,Javascript,Html,Css,我有一个html页面,带有导航栏。理想情况下,一旦用户选择了一个选项,该选项背景图像就会改变。但是,我无法通过使用javascript动态更改list属性来实现这一点 html: <html> <head> <link href="includes/css/content.css" rel="stylesheet" type="text/css"> <script> function select(id) { alert(id);
<html>
<head>
<link href="includes/css/content.css" rel="stylesheet" type="text/css">
<script>
function select(id)
{
alert(id);
var list = document.getElementsByTagName('li');
for(var i=0;i<list.length;i++)
{
list[i].class='random';
}
document.getElementById(id).class='selected';
}
</script>
</head>
<body>
<div id="mainContent">
<div class = 'nav'>
<ul>
<li class='selected' id='home' onClick="select(this.id)"><a href="#" ><span style='color:gray'>Home</span></a></li>
<li id='system' onClick="select(this.id)"><a href="#" ><span style='color:gray'>Systems</span></a></li>
<li id='temp' onClick="select(this.id)" ><a href="#"><span style='color:gray'>Notification Template</span></a></li>
</ul>
</div>
</body>
</html>
这里有什么我做错了吗?如果你这样设置一个类,你会想使用
。className
[]如果你这样设置一个类,你会想使用。className
[]属性class
对于Htmlement来说不存在。使用className
设置css类
有关属性的完整列表-请参见HtmleElement的属性
类
。使用className
设置css类
有关属性的完整列表,请参见
list[i].class='random'代码>应该是列表[i].className+='random'
className是否解决了您的问题,或者它仍然不合作?@Llepwryd是的,它可以工作。谢谢。list[i]。class='random'代码>应该是列表[i].className+='random'
className是否解决了您的问题,或者它仍然不合作?@Llepwryd是的,它可以工作。谢谢
.nav .selected a{
background-size:cover;
background: url(../images/nav.gif) no-repeat top;
color:white;
}