从父(jQuery)剥离特定标记

时间:2010-01-28 12:15:25

标签: jquery html tags strip

HTML:

<div class="featured">
    <h4><a href="#">Title 1</a></h4>
    <a href="#"><img src="image.png" class="image"/></a>
    <p><a href="#"></a><br />
    Description goes here</p>
</div>

<div class="featured">
    <h4><a href="#">Title 2</a></h4>
    <a href="#"><img src="image.png" class="image"/></a>
    <p><a href="#"></a></p>
    <p>Description goes here</p>
</div>

..如何从.featured中删除所有<p>个标签?

由于

5 个答案:

答案 0 :(得分:2)

这样可行,但只是因为你的段落元素位于你的div的末尾:

$(".featured p").each(function(){
    var content = $(this).html();
    $(this).parent().append(content);
    $(this).remove();
});

答案 1 :(得分:2)

查看Ben Alman's unwrap "plugin"

$.fn.unwrap = function() {
  this.parent(':not(body)')
    .each(function(){
      $(this).replaceWith( this.childNodes );
    });

  return this;
};

您的用法是:

$(".featured p > *").unwrap();

答案 2 :(得分:1)

$(".featured p").remove();

这可以通过将每个<p>更改为<span>来实现。它就地执行,因此<p>不必在最后(没有附加 - 它不会重新排序元素):

$(".featured p").replaceWith(function(){
     return $('<span />').html( $(this).html() );
});

它使用的是html,因此该元素将丢失数据和事件绑定。

答案 3 :(得分:1)

这样的东西?

$(".featured p").each(
  function(){
    $(this).after($(this).html()).remove();
});

编辑2:经过测试,有效。好又简单。

答案 4 :(得分:1)

使用jQuery 1.4你可以这样做:

$(".featured p *").unwrap();
$(".featured p").each(function(){
  $(this).replaceWith("<span>"+ $(this).text() + "</span>")
});

测试here

文本节点不会被解开,因此您必须单独执行它们。我不确定为什么replaceWith要求他们在标签内。