Question

我有以下HTML内容：

<div class="content">
    <div class="div-content">
        <div>
            <div class="div-botoes">
                <input id="bt1" type="button" tabindex="0" value="bt1">
                <input id="bt2" type="button" tabindex="0" value="bt2">
            </div>
            <ul class="divFormArea">
                <li id="li1">
                    <span><span>span</span></span>
                    <div>
                        <div>
                            <div> lorem ipsum </div>
                            <div> lorem ipsum </div>
                        </div>
                        <div>
                            <div> lorem ipsum </div>
                            <div>
                                <div> lorem ipsum </div>
                            </div>
                            <div>
                                <div> lorem ipsum </div>
                            </div>
                        </div>
                        <div>
                            <div> lorem ipsum </div>
                            <div> lorem ipsum </div>
                        </div>
                        <div>
                            <div> lorem ipsum </div>
                            <div>
                                <div> lorem ipsum </div>
                            </div>
                            <div>
                                <div> lorem ipsum </div>
                            </div>
                        </div>
                    </div>
                </li>
                <li id="li2">
                    <span><span>span</span></span>
                    <div>
                        <div>
                            <div> lorem ipsum </div>
                            <div> lorem ipsum </div>
                        </div>
                        <div>
                            <div> lorem ipsum </div>
                            <div>
                                <div> lorem ipsum </div>
                            </div>
                            <div>
                                <div> lorem ipsum </div>
                            </div>
                        </div>
                        <div>
                            <div> lorem ipsum </div>
                            <div> lorem ipsum </div>
                        </div>
                        <div>
                            <div> lorem ipsum </div>
                            <div>
                                <div> lorem ipsum </div>
                            </div>
                            <div>
                                <div> lorem ipsum </div>
                            </div>
                        </div>
                    </div>
                </li>
                <li id="li3">
                    <span><span>span</span></span>
                    <div>
                        <div>
                            <div> lorem ipsum </div>
                            <div> lorem ipsum </div>
                        </div>
                        <div>
                            <div> lorem ipsum </div>
                            <div>
                                <div> lorem ipsum </div>
                            </div>
                            <div>
                                <div> lorem ipsum </div>
                            </div>
                        </div>
                        <div>
                            <div> lorem ipsum </div>
                            <div> lorem ipsum </div>
                        </div>
                        <div>
                            <div> lorem ipsum </div>
                            <div>
                                <div> lorem ipsum </div>
                            </div>
                            <div>
                                <div> lorem ipsum </div>
                            </div>
                        </div>
                    </div>
                </li>
                <li id="li4">
                    <span><span>span</span></span>
                    <div>
                        <div id="dontWantThisDiv" class="dont-want-this-div">
                            <div>
                                <div>
                                    Elements
                                </div>
                            </div>
                            <div>
                                Elements
                            </div>
                        </div>
                        <script id="script">
                            ScriptContent
                        </script>
                    </div>
                </li>
            </ul>
            <span><span><span>a</span>c<span>b</span></span>d</span>
        </div>
    </div>
</div>

我想使用一个jQuery 1.9.1选择器，它为我提供了关于除了 div #dontWantThisDiv之外的所有内容。

我尝试了很多选择器，但似乎没有人选择我想要的东西。这是一个Fiddle

Answer 1

如果你想获得.content下的所有元素，除了#dontWantThisDiv而不是选择器你可以试试这个： -

var cloneHtml = $( ".content" ).clone().find('#dontWantThisDiv').remove();
console.log(cloneHtml.html())

Answer 2

因为您希望在没有特定子节点的情况下返回整个DOM，所以无论您是否消除了后代节点，您的结果都将只包含单个顶级节点（<div class="content">）。

如果允许您自己更改HTML内容，那么使用$('#dontWantThisDiv').remove();从DOM中删除该节点并保留其他所有内容会更容易。

如果您不允许更改HTML内容，那么可能会详细说明您的方案，我们可以看看是否有更有效的技术来实现它。

jQuery选择除孩子之外的所有东西

2 个答案: