Question

如何编写JavaScript条件语句：

If an li tag has a class of "disabled" then add a class of "hide"

我正在尝试将该类添加到具有此类的li标记中。 li标签没有id。

Answer 1

首先，您必须获取所有li标记：

var lis = document.getElementsByTagName('li');

然后循环遍历它们并执行操作：

for(var i = lis.length; i--;) {
    var li = lis[i];
    if(/\bdisabled\b/.test(li.className)) {
        li.className += ' hide';
    }
}

参考： getElementsByTagName，className

为什么我们不能使用getElementsByClassName？

因为它是not supported up to and including IE8。

但您可以测试浏览器是否支持querySelectorAll：

if(typeof document.querySelectorAll === 'function') {
    var lis = document.querySelectorAll('li.disabled');
    for(var i = lis.length; i--;) {
        lis[i].className += ' hide';
    }
}
else {
    // code from above
}

如果您只引用某些li，则只使用if class：

if(/\bdisabled\b/.test(element.className)) {
    element.className += ' hide';
}

（在所有情况下，您还可以添加进一步的测试以检查元素是否已经具有hide类。）

<强>更新

如果您想再次删除该类，可以进行类似的循环并使用replace：

for(var i = lis.length; i--;) {
    var li = lis[i];
    li.className = li.className.replace(/\s*hide\s*/, '');
}

您应该考虑使添加和删除类函数可重用，以便您也可以将它们与其他类一起使用。

Answer 2

使用jQuery：

$('li.disabled').addClass('hide');

Answer 3

如果你喜欢jQuery：

$('li').hasClass('disabled').addClass('hide');

（明确提及hasClass只是为了参考和清晰，尽管li.disabled同样有效。）

var items = document.getElementsByTagName('li');
for (var i = 0; i < items.length; i++){
    var item = items[i];
    if (/\bdisabled\b/.test(item.className)){
        item.className += ' hide';
    }
}

Answer 4

嗯，所有禁用的LI元素需要一类隐藏？你不能编辑CSS并隐藏它们吗？或者使用JavaScript将类添加到HTML或BODY元素，然后添加到CSS中，例如：

HTML.hide-disabled LI.disabled {/ *属性隐藏这些元素* /}

我正在尝试将类添加到具有禁用类的li标记

4 个答案: