Question

我有一个来自我的网页的元素数组，我试图插入一些html，作为变量存储到匹配的数组项中。例如

<div class="play">
  <div>
    <p>Item to be inserted after this p tag</p>
  </div>
</div>

var elements = $('.play');
//elements length = 4;
var item = '<p>HTML to be inserted</p>'
$(item).appendTo(elements[1]);

在上面的代码中，我试图将'item'插入html中显示的子div中数组的第二个值，但是我不确定如何将它插入到子div中。目前，这在父html标签包含.play。

之后插入'item'

非常感谢任何帮助。

Answer 1

请注意elements不是数组，它是一个jQuery对象，这意味着您可以使用jQuery方法遍历DOM：

elements.eq(1).find("div").append(item);

演示：http://jsfiddle.net/rgQ7g/

.eq(1)选择第二项，但将其包装在另一个jQuery对象中，这样您就可以使用.find("div")转到子div并.append()将item转换为{{1}}它

Answer 2

尝试after()：

$('.play').find('p').after(item);

这将在DOM中的选定元素之后插入内容。它也适用于所有名为.play

的类

如果您需要指定索引，我建议使用一个函数：

function appendPlay(index, content) {
    $('.play').eq(index).find('p').after(content);        
}

appendPlay(2, '<p>HTML to be inserted</p>');

jsFiddle

Answer 3

请尝试使用

var element = $('.play div p');
var item = '<p>HTML to be inserted</p>'
$(element).parent().append(item);

编辑从

var element = $('.play div');
var item = '<p>HTML to be inserted</p>'
$(element).append(item);

Answer 4

您可以使用以下链接。（我在评论后编辑了代码）

您应该编写像;

这样的代码

var selector = ".play",
    text = "<p>HTML to be inserted</p>";
$(selector + " div p").eq(1).after(text);

http://jsbin.com/esesul/5/

Answer 5

嗯，我想这会奏效：

$(item).appendTo($(elements));

但更好的解决方案是使用：

$('.play').find('p').after(item);

将变量插入数组项

5 个答案:

jsFiddle