Question

如何使用jQuery’s after()在具有特定属性的div之后插入数据？

我的<div>就像这样

<div id="mod" mod-id="1" mod-user="user1">
Content 1
</div>

<div id="mod" mod-id="2" mod-user="user2">
Content 2
</div>

<div id="mod" mod-id="3" mod-user="user3">
Content 3
</div>

在这里，我如何告诉jQuery的after()在id="mod" and mod-id="2"之后插入数据？

我可以告诉after()在id="mod"之后插入，但不知道如何根据div的数据属性告诉它。

Answer 1

ID必须是唯一的，您可以使用类而不是使用自定义属性，您可以使用HTML5 data-*属性：

<div class="mod" data-mod-id="1" data-mod-user="user1">
  Content 1
</div>

<div class="mod" data-mod-id="2" data-mod-user="user2">
  Content 2
</div>

<div class="mod" data-mod-id="3" data-mod-user="user3">
  Content 3
</div>

现在您可以使用类和属性选择器选择元素。

$('div.mod[data-mod-id="2"]').after('data');

Answer 2

首先，你不能拥有多个相同的ID。将它们更改为类。现在它是一个类，

var field = $('.mod');

field.each(function(){
     if($(this).attr('mod-id')==2){
           $(this).after();
     }
});

或者

$('.mod[mod-id=2]').after();

Answer 3

$("div[id=mod]").each(function() {
   if ($(this).attr("mod-id") == 2) {
      $(this).after("CVVVVVVVVVV");
   }
});

Answer 4

你可以这样做

$( '[id=mod][mod-id=2]' ).after( 'xy' );

但你真的不应该再使用id一次！使用mod-id之类的自定义属性也很少见，更好地使用自html 5以来的数据属性，例如data-mod-id

使用带有divs属性的jquery＆之后

4 个答案: