使用Javascript更改a-element上的类

Question

我是Javascript的新手,我遇到了一个烦人的问题.

我有一个包含列表的列表.我有一个脚本,可以在单击时将列表设置为可见/不可见.但是,一旦按下它,我就不会切换/添加一个类到链接.

我的列表看起来像这样

<ul>
    <li><a href="#" onclick="toggle('item1');">Click something</a>
    <ul id="item1" style="display: none;">
        <li>Something ...</li>
        <li>Something something</li>
    </ul></li>
    <li><a href="#" onclick="toggle('item2');">Click something else</a>
    <ul id="item2" style="display: none;">
        <li>Something more...</li>
        <li>Something something less?</li>
    </ul></li>
</ul>

我的脚本看起来像这样:

<script type="text/javascript">
    function toggle(id) {
        var v = document.getElementById(id);

        if (v.style.display == '') {
            v.style.display = 'none';
            v.removeClass("selected");
        } else {
            v.style.display = '';
            v.addClass("selected");
        }
    }
</script>

列表显示和隐藏它应该,但不添加或删除类.

CSS是这样的:

a:link {
    color: #000000;
    text-decoration: none;
}

a:hover, a.selected {
    color: #005b97;
    text-decoration: none;
    padding-left: 2px;
}

提前致谢

最好的问候本杰明

Answer 1

js没有内置的添加和删除类

试试这个

添加一个类

document.getElementById("MyElement").className += " MyClass";

删除一个类

document.getElementById("MyElement").className = document.getElementById("MyElement").className.replace ( /(?:^|\s)MyClass(?!\S)/ , '' )

如果你需要检查一个元素是否有一个类

function hasClass(ele,cls) {
return ele.className.match(new RegExp('(\\s|^)'+cls+'(\\s|$)'));
}