jQuery nextUntil包含文本节点 [英] jQuery nextUntil include text nodes

问题描述

我正在使用 nextUntil 方法来获取两个元素之间的所有内容。但是此方法不包括要输出的文本节点。它给出了一个类似 [< br>，< br>，< br>] 的数组。如何获取包括文本节点在内的所有内容？

I'm using nextUntil method to get all stuff between two elements. But this method does not include text nodes to output. It gives an array like [<br>, <br>, <br>]. How can I get all stuff including text nodes?

这是HTML代码：

$('.content a:contains("spoiler").b:even').each(function() {
  $(this).nextUntil('.content a:contains("spoiler").b')
    .wrapAll('<div style="border:solid 1px black;"></div>');
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="content">
  --- <a class="b" href="/?q=spoiler">spoiler</a> ---
  <br>
  <br> dangerous text here
  <br> --- <a class="b" href="/?q=spoiler">spoiler</a> ---
  <br> safe text here
  <br> --- <a class="b" href="/?q=spoiler">spoiler</a> ---
  <br>
  <br> dangerous text here
  <br> --- <a class="b" href="/?q=spoiler">spoiler</a> ---
</div>

JSFiddle： http://jsfiddle.net/Lwk97rvq/1/

JSFiddle: http://jsfiddle.net/Lwk97rvq/1/

推荐答案

只有jQuery .contents（）方法返回所有节点（包括通常被忽略的文本节点）。

Only the jQuery .contents() method returns all nodes (including text nodes, normally ignored).

那么可能是这样的？：

http://jsfiddle.net/ykv3gf5L/2/

$('.content').each(function () {
    var open = false;
    var result = $();
    $(this).contents().each(function () {
        var $this = $(this);
        if ($this.text() == "spoiler") {
            if (open) {
                result.wrapAll('<div style="border:solid 1px black;"></div>');
                open = false;
            } else {
                result = $();
                open = true;
            }
        } else {
            result = result.add($this)
        }
    });
    if (open) {
        result.wrapAll('<div style="border:solid 1px black;"></div>');
    }
});

它只是迭代所有节点，并根据标志启动新集合，或包装找到的节点。

It just iterate all nodes and based on a flag starts a new collection, or wraps the nodes found.

最后的 if（open）允许内容中的未闭合的spolier块入级div。

The final if (open) allows for an unclosed spolier block within a content classed div.

注意：

• $（）是一个空的jQuery集合（就像一个空数组，但是对于jQuery对象）


• 我建议你使用一个样式为你的剧透和使用一个类，例如 result.wrapAll（'< div class =spoiler>< / div>'）;

• $() is an empty jQuery collection (like an empty array but for jQuery objects)
• I suggest you use a style for your spoilers and use a class e.g. result.wrapAll('<div class="spoiler"></div>');

例如 http://jsfiddle.net/ykv3gf5L/3/

这篇关于jQuery nextUntil包含文本节点的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！