Question

我是jquery的初学者，并试图在现有代码中进行更改。我想在特定索引处插入包含一些JS的div。

<div id="test1"> <!-- JS code--> </div>

现有代码会在test1

处插入此<a name='more'></a> div

<script>
$(document).ready(function(){
  jQuery('#test1').appendTo(jQuery('a[name="more"]'));
    });
</script>

这段代码完美无缺我希望在运行时生成的2个不同索引处插入div。比方说，我希望在 50th，100th 位置或索引处插入div。

我试过了

jQuery('#test1').insertAfter($(this).children().eq(50));
jQuery('#test1').insertAfter($(this).children().eq(100));

但不起作用。我想知道它是否可能？ HTML很简单，包括div，img，br。标记中没有表格。

P.S。考虑到追加不破坏html，已经计算了索引。

Answer 1

获取您的元素集，使用.eq()缩小到您想要的元素并使用.after()追加。有关基于此代码的工作示例，请参阅：http://jsfiddle.net/YPvDf/：

<div id="blah">
  <p>How now</p>
  <p>How now</p>
  <p>How now</p>
  <p>How now</p>
  <p>How now</p>
  <p>How now</p>
</div>
<button id="aButton">Click me</button>
jQuery('#aButton').click(function () {
  jQuery('#blah p').eq(3).after('<p>Brown Cow</p>');
});

还要记住，元素集是零索引的，所以使用.eq(49)在第50个元素之后插入，依此类推。

已更新澄清了您的需求后，这里有一些代码可以执行我认为您想要的内容（与上面相同的HTML）：

jQuery('#aButton').click(function () {
  var stuff = jQuery('#blah').html();
  var splitIndex = 31;
  var myString = '<span> Brown Cow! </span>';
  var beforeString = stuff.substring(0,splitIndex);
  var afterString = stuff.substring(splitIndex);
  jQuery('#blah').html(beforeString + myString + afterString);
});

这里的工作示例：http://jsfiddle.net/uKgwU/

如果没有，那么抱歉......下次再试着在你的问题中更清楚了！

在特定索引处插入div

1 个答案: