Динамически создавать div с увеличенным идентификатором, используя jquery - PullRequest
5 голосов
/ 28 октября 2011

У меня есть текст, который я хочу добавить несколько div, но идентификатор должен быть изменен динамически.Например:

<div id=first>text</div>
<div id=first0>text</div>
<div id=first1>text</div>
<div id=first2>text</div>
<div id=first3>text</div>
<div id=first4>text</div>
<div id=first5>text</div>

Любая помощь?спасибо ..

Ответы [ 4 ]

15 голосов
/ 28 октября 2011

Ваш заголовок и содержание вопроса не соответствуют друг другу. Я предполагаю, что вы хотите создать div, где каждый идентификатор последовательно увеличивается при каждом создании?

$(function(){
  var count = 0;
  $('#append').click(function(){
    $('#parent').append('<div id="first'+count+'">text</div>');
    count++;
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a id="append">Add DIV</a>
<div id="parent"></div>
11 голосов
/ 28 октября 2011

Вы можете изменить его с помощью .attr () :

$('#first').attr('id', 'first6')
2 голосов
/ 28 октября 2011

попробуйте изменить код на:

<div id="first">text</div>
<div id="first0">text</div>
<div id="first1">text</div>
<div id="first2">text</div>
<div id="first3">text</div>
<div id="first4">text</div>
<div id="first5">text</div>

не забывайте id внутри "" (id="first" не id=first)

, теперь вы можете просто использовать jquery:$("#first").attr('id','first6');

1 голос
/ 07 апреля 2018

Если вас интересовало, как работает укладка.

$(function(){
  for (let i = 0 ;i < 10; i ++){  
      $('#foo').append('<div id="first'+i+'">text</div>');
  }
});
#first4 {
  background: blue;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="foo"></div>
...