jquery的删除HTML元素（jquery对象）

内部HTML我有此DIV：jquery的删除HTML元素（jquery对象）

<div class="teaser"> 
    <img src="thumb1.jpg"><img src="thumb2.jpg"><br> // usually one thumb image; can be up to three 
    some text goes here, sometimes not<br> 
    <a href="example.html">always a link here</a><br> 
    and sometimes another line here 
</div>

我需要捕获DIV减去在一个变量中的第一行（拇指）的含量，以传作为标题（标题）添加到灯箱脚本。然而，在一天，我学会了一些JavaScript的&的jQuery（都是我的弱点），但没有我在网上搜索，其中包括几个线程这里计算器，做了它，要么抛出错误或仍包括拇指发现或清除文字也一样，甚至从DOM移除了大拇指：

// takes the whole 
var teaser = $(".teaser"); 

// TypeError: $(...).html(...).find is not a function 
var teaser = $(".teaser").find("img").remove(); 

// IMGs removed from DOM 
var teaser = $(".teaser").find("img").remove(); 

// IMGs still included; I think I understand why 
var teaser = $(".teaser").not("img"); 

// ditto 
var teaser = $(".teaser").clone().not("img"); 

// ditto: 
var teaser = $(".teaser"); 
$(teaser).find("img").remove(); 

// no teaser at all (everything removed, not just the IMGs) 
var teaser = $(".teaser"); 
teaser = $(teaser).find("img").remove(); 

// ditto 
var teaser = $(".teaser").clone().find("img").remove();

改变chainings序列时没有工作，要么（虽然我可能已经错过了一个或其他）。

这种解决方法似乎是确定：

var teaser = $(".teaser").html().replace(/(<img.*?)+<br[^>]*?/i,"");

然而，依赖于浏览器中的正则表达式实现它可能是不稳定的，所以我宁愿有一些更稳健，特别是没有得到第一线的。

TIA的任何建议 - 希望我能说清楚了。

编辑：

使用clone()连同children()或contents()让我进了一步。然而，这些也将删除第一个文本节点，留下两个空BR背后：

$("div.teaser").each(function() { 
    var teaser = $(this).clone().children().not("img"); 
    var teaser = $(this).clone().contents().not("img"); 
});

OTOH filter("img")，find("img")或not("img")其次remove()去除一切，但IMGS，这超出了我的头，除了not()

var teaser = $(this).clone().find("img").remove();

编辑2：

为了总结的东西了：

这是@karaxuna建议的解决方案。重新分配变量很重要。

var teaser = $(this).clone(); 
teaser.find("img,br:first").remove(); 
teaser = $.trim(teaser.html());

虽然做了一些进一步的阅读，以便更好地理解失败背后的逻辑和最终解决方案，我得到了一个线索做稍微更jquerish：

var teaser = $(this).clone(); 
teaser = $.trim($("img,br:first",teaser).remove().end().html());

的线索范围，或上下文，添加到$()选择器。使用这这里为大家熟悉，但它从来没有想过我使用var。此外，end()将继续remove()从一路还是要到DOM ...

$.trim技术上没有必要，当然，HTML忽略空行呢。

因此包括与正则表达式以上的解决方法至少有三种方式去 - 有点让我想起的Perl;）

由于双方@karaxuna和@Ravi分享他们的经验和想法！

来源

2013-03-07 JayAitch

无需html()

var teaser = $(".teaser").find("img").remove();

编辑：

试试这个：

var teaser = $(".teaser").clone(); 
teaser.find("img").remove() 
// use teaser

来源

2013-03-07 11:27:07 karaxuna

你说得对的HTML（）和我删除它。这只是在replace（）的解决方法中需要的。 – JayAitch 2013-03-07 15:38:03

这完全消除了IMG。 'var teaser = $（“teaser”）。clone（）。find（“img”）。remove（）;'保留IMG，但删除文本（sic！）而var teaser = $（“teaser”） .clone（）。not（“img”）;'保留整个DIV（高于我的头），使用'filter（“img”）'代替结果没有标题（有意义）。 – JayAitch 2013-03-07 15:45:14

@JayAitch查看问题编辑 – karaxuna 2013-03-07 16:41:14

如果你想删除整个HTML。那么你可以使用空（）方法

$(".teaser").empty();

如果你只是删除图像。然后

$(".teaser").find("img").remove();

来源

2013-03-07 11:30:17

@karaxuna @Ravi：谢谢，但是这些完全从DOM中移除IMG。我需要从'var teaser'中移除它们（或者首先不要在var中接收它们）。 – JayAitch 2013-03-07 12:16:56

现在已经晚了，但试试这个$('img',$('.teaser')).remove().end().clone()

来源

2013-06-10 03:01:20 janbee

jquery的删除HTML元素（jquery对象）

回答

相关问题