在javascript中选择并添加类

新手上路,请多包涵

如果可能跨平台,我如何在无法添加 ID 的代码上选择 Javascript 中的类(但请不要选择 Jquery -MooTools 很好 -)?具体来说,我想在下面的任何 li 上添加类“cf”:

HTML

 <div class="itemRelated">
  <ul>
<li class="even">
<li class="odd">
<li class="even">

我试图摆弄它,但缺少一些东西:

Javascript

  var list, i;
list = document.getElementsByClassName("even, odd");
for (i = 0; i < list.length; ++i) {
    list[index].setAttribute('class', 'cf');
}

JSFiddle

附言。这个问题在现象上有可能 重复,( 另一个)但没有一个答案清楚。

原文由 Yannis Dran 发布,翻译遵循 CC BY-SA 4.0 许可协议

阅读 230
2 个回答

使用普通的javascript:

 var list;
list = document.querySelectorAll("li.even, li.odd");
for (var i = 0; i < list.length; ++i) {
   list[i].classList.add('cf');
}

演示

对于旧的浏览器,你可以使用这个:

 var list = [];
var elements = document.getElementsByTagName('li');
for (var i = 0; i < elements.length; ++i) {
    if (elements[i].className == "even" || elements[i].className == "odd") {
        list.push(elements[i]);
    };
}
for (var i = 0; i < list.length; ++i) {
    if (list[i].className.split(' ').indexOf('cf') < 0) {
        list[i].className = list[i].className + ' cf';
    }
}

演示


使用 Mootools:

 $$('.itemRelated li').addClass('cf');

演示

或者如果您想按类别定位特定目标:

 $$('li.even, li.odd').addClass('cf');

演示

原文由 Sergio 发布,翻译遵循 CC BY-SA 4.0 许可协议

我知道这是旧的,但有什么理由不简单地这样做(除了潜在的浏览器支持问题)?

 document.querySelectorAll("li.even, li.odd").forEach((el) => {
    el.classList.add('cf');
});

支持: https ://caniuse.com/#feat=es5

原文由 MuffinTheMan 发布,翻译遵循 CC BY-SA 4.0 许可协议

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题