javascript - 使用 jquery 从无序列表中删除标记

Question

在以下内容中，我需要删除标记标签<div class="sub">和</div> 但不是 jquery 的内容。这是为了使菜单适应响应式布局。

<nav id="top">  
<ul>
    <li class="ti" id="snw"> <a class="mm" href="/snowdepth/">Weather</a>
       <div class="sub">    

          <ul>
               <li><h2>Snowline</h2></li>
                <li><a href="/alpen/nordliche%20ostalpen/">Nordliche Ostalpen</a></li>    
         </ul>

      </div>
    </li>

    <li class="ti" id="blg"> <a class="mm" href="/live/">Weblog</a></li>
</ul>
</nav>

Answer 1

尝试unwrap()：

​$('.sub').find('ul').unwrap()​;

本质上，您正在寻找 的所有子元素.sub，并将它们展开或删除它们的父元素。

这是演示：http: //jsfiddle.net/yEseX/

Answer 2

你可以这样做。

现场演示

$('.sub').parent().html($('.sub').html());

Answer 3

假设您可能有多个 div 与 class sub，我建议这样做：

var container = $('#top');
container.html(
    container.html().split('<div class="sub">').join('').split('</div>').join('')
);

Answer 4

试试这个，

 var content = $(".sub").html(); // stored ".sub" div content
 $(".sub").remove(); // remove ".sub" div
 $("#top #snw").after(content); // insert content where you want

Answer 5

试试这个：

var list = $('#snw');
var html = list.html();
list.html(html.replace('<div class="sub">','').replace('</div>',''));

演示在这里

Answer 6

我认为@Abhilash 的答案是迄今为止最简洁的，但我会稍微修改选择器：

$('.sub').contents().unwrap();

这将删除所有.sub元素，将其内容保留在原处。

JsFiddle：http: //jsfiddle.net/yEseX/2/