是否可以删除 html 元素并让您的孩子使用 javascript？

Question

我有以下结构..我想删除div.son但保留div.grandson，这可能吗？！或者改变你的<tag>也是一个解决方案..例如：从 a 更改<fieldset>为 a <div>，记住我无权访问 HTML，每个更改都必须使用 ** javascript ** 完成！

<div class="father">

  <fieldset class="son">

    <div class="grandson">Content here</div>

    <div class="grandson">Content here</div>

    <div class="grandson">Content here</div>

    <div class="grandson">Content here</div>

  </fieldset>

</div>

我尝试使用removeChild ()** javascript **的功能，但它删除了整个元素。

Answer 1

使用普通 JavaScript，可以在删除其他任何内容之前深度克隆孙子节点。然后将其附加回父级。当然如果你想把它放在其他地方，你需要附加所需的 DOM 遍历逻辑。（CSS部分仅用于结果的视觉验证）const grandson = document.querySelector('.grandson');const father = grandson.closest('.father');const clonedGrandson = grandson.cloneNode(true);father.querySelector('.son').remove();father.appendChild(clonedGrandson);.father {&nbsp; background-color: red;&nbsp; padding: 20px;&nbsp;}&nbsp;&nbsp;.son {&nbsp; background-color: blue;&nbsp; padding: 20px;&nbsp;}&nbsp;&nbsp;.grandson {&nbsp; background-color: green;&nbsp; padding: 20px;&nbsp;}<div class="father">&nbsp; <fieldset class="son">&nbsp; &nbsp; <div class="grandson">&nbsp; &nbsp; &nbsp; <p>Save me</p>&nbsp; &nbsp; </div>&nbsp; </fieldset></div>

Answer 2

你可以看看这个答案，下次尝试使用搜索栏。如果你只是想跳过答案。var cnt = $(".remove-just-this").contents(); $(".remove-just-this").replaceWith(cnt);