删除给定子元素之后的所有内容（元素和文本）答案

【问题标题】：remove everything (elements and text) after a given child element删除给定子元素之后的所有内容（元素和文本）
【发布时间】：2019-02-06 21:48:56
【问题描述】：

我现在正在使用我们的 Gmail 扩展程序，并且鉴于我有父元素并且它看起来如下所示，我需要删除 <br clear="all" /> 之后的所有内容，因为给定之后的内容可能存在也可能不存在用户 Gmail 签名设置。想法？

<div
    id=":93"
    class="Am Al editable LW-avf"
    hidefocus="true"
    aria-label="Message Body"
    g_editable="true"
    role="textbox"
    aria-multiline="true"
    contenteditable="true"
    tabindex="1"
    style="direction: ltr; min-height: 416px;">
    Test
    <br clear="all" />
    <div>
        <br />
    </div>
    -- <br />
    <div dir="ltr" class="m_-1358982132021700848m_4914548661371847332gmail_signature" data-smartmail="gmail_signature">
        <div dir="ltr">
            <b>Suzy Smith</b>
            <div>
                <i><a href="mailto:suzysmith@mail.com" target="_blank">suzysmith@mail.com</a></i>
            </div>
        </div>
    </div>
</div>

【问题讨论】：

elementNode.nextSibling
只删除所有下一个兄弟姐妹。更多信息：stackoverflow.com/questions/4378784/…
@epascarello 我认为 nextSiblingElement 公开了 remove() 方法，但这种方法不会只删除下一个，我需要删除所有这些。

标签： javascript

【解决方案1】：

只需遍历 nextSibling 并将其删除。

var elem = document.querySelector('[clear="all"]')
while(elem.nextSibling) {
  elem.nextSibling.remove()
}
elem.remove()

<div
    id=":93"
    class="Am Al editable LW-avf"
    hidefocus="true"
    aria-label="Message Body"
    g_editable="true"
    role="textbox"
    aria-multiline="true"
    contenteditable="true"
    tabindex="1"
    style="direction: ltr; min-height: 416px;">
    Test
    <br clear="all" />
    <div>
        <br />
    </div>
    -- <br />
    <div dir="ltr" class="m_-1358982132021700848m_4914548661371847332gmail_signature" data-smartmail="gmail_signature">
        <div dir="ltr">
            <b>Suzy Smith</b>
            <div>
                <i><a href="mailto:suzysmith@mail.com" target="_blank">suzysmith@mail.com</a></i>
            </div>
        </div>
    </div>
</div>

【讨论】：