Question

使用纯Javascript我想创建一个制表符效果来切换div中的内容。内容是我要添加或删除第二类有效的类的名称

            <script>
            function changeClass(element) {

                if (classList !=='active') {
                    element.classList.add('active');
                }
                else { element.classList.remove('active'); }
            }
            </script>
            <ul>
                <li onclick = "changeClass("content")">

Answer 1

错误在于您没有选择任何元素（想知道为什么没有人抓住这个），而是尝试更改字符串的类列表（"content".classList...）。确保首先选择正确的元素：

function changeClass(element) {
    element = document.getElementsByClassName(element)[0]; // assuming here we're selecting the first one
    if (!element.classList.contains('active')) { // had to fix this as variable classList wasn't defined
        element.classList.add('active');
    }
    else {
        element.classList.remove('active');
    }
}

另外，正如@Teemu在评论中提出的那样，但拒绝写出来，请随意使用element.classList.toggle('active');。所以整个代码应该是：

function changeClass(element) {
    element = document.getElementsByClassName(element)[0]; // assuming here we're selecting the first one
    element.classList.toggle('active');
}

Answer 2

如果您只想在两个班级之间toggle，您可以这样做：

function changeClass(element) {
    element.classList.toggle('Content');
}

虽然在这种情况下你要传递对元素的引用而不是它的className。

用Javascript改变div

2 个答案: