getElementsByClassName 并连续更改每个类答案

【问题标题】：getElementsByClassName and change class of each one consecutivelygetElementsByClassName 并连续更改每个类
【发布时间】：2013-12-27 12:59:57
【问题描述】：

我正在使用 RSS 到 Javascript 转换器，所以我得到了大约 15 个具有相同类的项目，我想为单个类更改每个项目。

类似的东西。

getElementsByClassName('genericclass')class = ("one")
if("one") "alreadytaken" else ("two")
if("two") "alreadytaken" else ("three)

我希望你明白了，使用随机类选择器可能更容易吧？

这是一种 jQuery 方法，我无法从其他 javascript 生成的 div 中更改类。

看一看：http://jsfiddle.net/rrmonn/7tRMS/

【问题讨论】：

标签： javascript jquery css class

【解决方案1】：

你可以这样做：

$('.genericclass').each(function(i){
   $(this).addClass('customClass_' + i);
});

【讨论】：

喜欢这个简单的解决方案 ;) +1
唯一的问题是，OP 使用的是文本而不是数字，但它是最简单、最合乎逻辑的解决方案。 +1 希望 OP 知道如何创建相关的 CSS。

【解决方案2】：

试试类似的东西

var classes = ['one', 'two', 'three', 'four']
var els = document.getElementsByClassName('genericclass');
for (var i = 0; i < els.length; i++) {
    els[i].className = classes[i]
}

使用 jQuery

var classes = ['one', 'two', 'three', 'four']
$('.genericclass').removeClass().addClass(function(i){
    return classes[i]
})

演示：Fiddle

【讨论】：

这对常规类有很大帮助，但对其他 javascript 生成的类没有帮助。

【解决方案3】：

我会尝试这样使用 smt：

$('.genericclass').each(function(index,item){
  $(item).attr('id', $(item).attr('id') + '_' + index);
});

如果您不使用 jQuery，它将无法正常工作。希望对你有所帮助

【讨论】：

【解决方案4】：

您可以使用here 提到的脚本将数字转换为单词。然后你可以使用下面的代码 -

$.each($(".genericclass"), function(i, v){
    i = i+1;
    $(this).addClass(toWords(i));
});

检查这个fiddle

【讨论】：

【解决方案5】：

这是另一个选择：

(function() {
    var i, classes;
    classes = document.querySelectorAll('.genericclass');
    for(i=0; i<classes.length; i++) {
        classes[i].className = 'newclass' + i;
    }
}());

【讨论】：

【解决方案6】：

最终解决方案：

setTimeout(function(){ 
jQuery(function () {
var classes = ['one', 'two', 'three', 'four', 'one', 'two', 'three', 'four']
$('.rssincl-itemimage').removeClass().addClass(function (i) {
    return classes[i]
})})},150);

为其他 javascript 添加 setTimeout 以加载类，然后此脚本更改 evryt

【讨论】：