Question

我开始学习javascript，我有一些问题，想知道你是否可以这样做。

我有一个div：

<div class="category"> </div>

每次我在论坛系统中创建新类别时，它都会自动重复。这是默认值＆＃34;所以不可能手动＆＃34;

所以希望为每个类别添加编号。因此：

<div class="category1"> </div> 
<div class="category2"> </div> 
<div class="category3"> </div> 
<div class="category4"> </div>

依此类推，所有这一切都通过jquery或javascript。

如果有可能是什么方式？

Answer 1

jQuery解决方案：

$( ".category" ).each( function( index ) {
    $( this ).addClass( "category"+(index+1) );
});

结果：

<div class="category category1"> </div> 
<div class="category category2"> </div> 
<div class="category category3"> </div> 
<div class="category category4"> </div>

解决方案2：

$( ".category" ).each( function( index ) {
    $( this ).removeClass( "category" ).addClass( "category"+(index+1) );
});

结果：

<div class="category1"> </div> 
<div class="category2"> </div> 
<div class="category3"> </div> 
<div class="category4"> </div>

FIDDLE

Answer 2

<强> HTML

<button id="category-button">Add Category</button>
<div id="category-container"></div>

<强>的Javascript

$('#category-button').on('click', function() {
    var $container = $('#category-container'),
        $elem = $('<div/>', {
            "class": "category" + ($container.children().length + 1)
        });
    $container.append($elem);
});

添加Div以重复

2 个答案: