javascript - 通过 jQuery 用它的索引替换 html 元素

Question

我正在尝试替换通过它的索引获取的 HTML 元素，我正在尝试这样做，但它不起作用:

<div class="results">
    <div id="61">Result 1 content</div>
    <div id="8762">Result 2 content</div>
    <div id="234">Result 3 content</div>
</div>

<script>
    var index = 0;
    var html = '<div id="243">Result 1 content</div>';
    var element = $('.results').get(index);
    element.replaceWith(html);
</script>

如何通过 index 获取整个 HTML 元素？

Answer 1

$('.results div').eq(index).replaceWith(html);

Fiddle

你应该使用 .eq()通过其索引过滤 jQuery 对象内的匹配元素集。此外，$('.results') 只有 1 个元素(本身)。我假设您正在寻找其中的 div。

---

此外，如果您的 div 中有 div，请使用更具体的 child selector :

$('.results > div').eq(index).replaceWith(html);

这与使用 .children method 具有相同的效果使用选择器过滤器:

$('.results').children(':eq(' + index + ')').replaceWith(html);

或者更简单地说，将所有内容连接到一个选择器中:

$('.results > div:eq(' + index + ')').replaceWith(html);

Fiddle

还有许多其他方法可以使用 jQuery 完成此操作，但这些应该绰绰有余。 =]