Question

有没有办法用javascript / jquery删除特定div之后的所有内容并用新代码替换？

DIV是动态生成的，我希望能够删除之后的所有内容最后一个看起来像这样的div：

            <div class="galImage"> **div content** </div>
            /**delete everything after this point and replace with code below**/
        </div>
    </body>
</html>

我已经尝试$('.galImage').nextAll().remove();我发现其他地方在stackoverflow上但它似乎没有任何影响 - nextAll()甚至是合法的函数吗？

Answer 1

nextAll需要一个选择器。 E.g：

$('#afterme').nextAll('*').remove();

在这里看一个小提琴：http://jsfiddle.net/philwinkle/c5bGP/

Answer 2

您的问题有点不清楚，因为您已发布了似乎是标记片段的内容。

据我所知，您要删除textNode。选择器和大多数jQuery遍历方法都找不到文本节点，但您可以使用本机API选择它。

var galimg = $('.galImage')[0];  // <-- get the DOM element

    // traverse to its parent, and remove the node that is after the galImage
galimg.parentNode.removeChild( galimg.nextSibling );

如果要删除其他节点，则可以使用循环：

var galimg = $('.galImage')[0];
var node;

while( node = galimg.nextSibling ) {
    node.parentNode.removeChild( node );
}

考虑到您正在使用jQuery，如果确实要删除实际元素（不仅仅是文本节点），您应该使用.remove()，否则jQuery的缓存将不会更新，这可能会导致内存泄漏

var galimg = $('.galImage')[0];
var node;

while( node = galimg.nextSibling ) {
    $(node).remove();
}

或者如果你想要一个完整的jQuery解决方案，你可以这样做：

var galimg = $('.galImage');
var nodes = galimg.parent().contents(); // <-- .contents() includes text nodes
var idx = nodes.index( galimg );   // <-- get the index of galImage

nodes.slice( idx + 1 ).remove();  // <-- take a slice of the nodes, starting at
                                  //       the index after the galImage

Answer 3

var index = $('.myDiv').index(this);

$('div:gt(index)').remove();

那看起来不错？

Answer 4

使用remove，将从正文中删除元素，以便它不会显示，尽管它仍然存在于DOM中。

因为它无论如何都是动态的，你可以使用以下两种方式之一加载：加载每个div的内容，或加载div的所有html

$('#container').load('path/to/data');

在div上使用load时，它将替换已存在的数据。

我可以在特定DIV之后删除并替换所有内容

4 个答案: