0

我有一个带有导航栏的 html 页面。理想情况下，一旦用户选择一个选项，该选项的背景图像就会改变。但是，我无法通过使用 javascript 动态更改列表属性来实现这一点。

的HTML：

<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>

css 文件如下所示：

.nav .selected a{
background-size:cover;
background: url(../images/nav.gif) no-repeat top;
color:white;
}

我在这里做错了什么吗？

4

2 回答 2

2

classHTMLElement 不存在该属性。用于className设置 css 类。

有关属性的完整列表 - 请参阅http://www.w3schools.com/jsref/dom_obj_all.asp

于 2012-11-28T18:04:21.180 回答
1

如果您以这种方式设置类，则需要使用.className[ https://developer.mozilla.org/en-US/docs/DOM/element.className ]

于 2012-11-28T18:04:13.853 回答