使用jQuery删除div元素而不删除其中的任何内容

时间:2018-12-03 16:00:33

标签: javascript jquery html

<div class="1">
  <div class="2">
    <ul>
      <li>Item 1</li>
      <li>Item 2</li>
    </ul>
  </div>
</div>

如何仅删除div class="2"?我需要保留div 1以及ul和li。

结果:

<div class="1">      
  <ul><li>Item 1</li><li>Item 2</li></ul>
</div>

<div class="1">
  <!--<div class="2">-->
    <ul>
      <li>Item 1</li>
      <li>Item 2</li>
    </ul>
  <!--</div>-->
</div>

1 个答案:

答案 0 :(得分:1)

您需要使用.unwrap()来删除element的父代,但保持自身。

$(".2 > ul").unwrap();

$(".2 > ul").unwrap();
console.log($(".1")[0].outerHTML);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="1">
  <div class="2">
    <ul>
      <li>Item 1</li>
      <li>Item 2</li>
    </ul>
  </div>
</div>