Question

我有这样的结构

        <div class="dynamic" id="thumbnail-div">
            <p id="thumbnail-p">
                <a href="#">
                    <img src="images/circle.GIF" alt="Example Number 1 For Display Case" name="Example Number 1 For Display Case" class="dynamic" id="thumbnail-img" />
                </a>
            </p>
        </div>

上面有多个html结构，所以可能有10,20,50等等。现在我要做的是让jQuery将类更改为id为“thumbnail-div”的所有元素像thumb1，thumb2，thumb3等等。所以他们应该根据有多少来计算。我无法找到实现这一目标的方法，经过大量研究后我发现没有任何帮助。请帮忙。

提前致谢！

Answer 1

您的网页上似乎有重复的 ID 。

我担心如果您尝试使用ID访问这些元素，它只会检索the first element with that ID ..

让我们说你在问题中的所有div都有.dynamic类..然后你可以做这样的事情

$('div.dynamic').each(function(i){

     $(this).addClass('thumb' + (i+1));   // Add Class
     $(this).attr('id' , 'thumb' + (i+1));  // Set id for each div 
});

Check FIDDLE

Answer 2

首先，你不应该在页面上有任何重复的id，所以你应该将它们全部更改为类，这样它们应该是<di class = "dynamic thumbnail-div">并且jQuery可以在页面上获取所有这些id然后遍历并删除thumbnail-div的类名称并将其更改为thumb1 thumb2等将类似

$('.thumbnail-div').each(function(index) {
    $(this).removeClass('thumbnail-div');
    $(this).addClass('thumb' + index);
}

我很确定这应该有效。如果您想要删除类名，然后添加一个id，那么它们将是唯一的，您可以使用$(this).attr('id', 'thumb' + index);而不是.addClass行

Answer 3

您不能使用重复id的元素。

如果您对thumbnail-div使用class作为divs，那么您可以这样做

$(".thumbnail-div").each(function(index){
    $(this).addClass('thumb'+(index+1)); 
    // or set id $(this).attr('id' , 'thumb' + (index+1)); 
    alert($(this).attr('class'));
});

<强> Live Sample

Answer 4

答案在这里http://jsfiddle.net/A9SfJ/

$('.dynamic').addClass('thumb1').removeClass('dynamic');

jQuery - 动态更改具有相同id标签类名的元素

4 个答案: