jquery yếu tố remove html bên trong biến (jquery đối tượng)

Question

Bên HTML Tôi có DIV này:

<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> 

tôi cần phải nắm bắt được nội dung của DIV trừ dòng đầu tiên (các ngón tay) trong một biến để vượt qua trên dưới dạng tiêu đề (chú thích) cho tập lệnh hộp đèn. Tuy nhiên, trong một ngày tôi đã học được điều gì đó về javascript & jquery (cả hai đều là điểm yếu của tôi), nhưng không có gì tôi tìm thấy bằng cách tìm kiếm trên web, bao gồm một số chủ đề ở đây trên stackoverflow, đã làm, hoặc ném lỗi hoặc vẫn bao gồm các ngón tay cái hoặc xóa văn bản cũng vậy hoặc thậm chí xóa các ngón tay cái khỏi 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(); 

Thay đổi chuỗi trong chuỗi không hoạt động (mặc dù tôi có thể đã bỏ lỡ một hoặc một chuỗi khác).

workaround này có vẻ là ok:

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

Tuy nhiên, tùy tình hình thực hiện regex trong các trình duyệt nó có thể run rẩy, vì vậy tôi muốn có một cái gì đó mạnh mẽ hơn, đặc biệt là không nhận được dòng đầu tiên ở tất cả.

TIA cho bất kỳ đề xuất nào - hy vọng tôi có thể làm cho bản thân mình rõ ràng.

Edit:

sử dụng clone() kết hợp với children() hoặc contents() đã cho tôi một bước xa hơn. Tuy nhiên, cả hai cũng sẽ loại bỏ các nút văn bản đầu tiên, để lại hai rỗng BR đằng sau:

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

OTOH filter("img"), find("img") hoặc not("img") Tiếp theo remove() loại bỏ tất cả mọi thứ nhưng imgs, đó là ngoài đầu tôi trừ not()

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

chỉnh sửa 2:

Để quấn mọi thứ lên:

Đây là giải pháp @karaxuna đề xuất. Điều quan trọng là gán lại biến.

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

Trong khi làm một số đọc thêm để hiểu rõ hơn về logic đằng sau những thất bại và giải pháp cuối cùng tôi có một đầu mối để thực hiện nó hơn một chút jquerish:

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

Các đầu mối là phạm vi, hoặc ngữ cảnh, được thêm vào bộ chọn $(). Sử dụng này ở đây là đủ quen thuộc, nhưng nó không bao giờ xảy ra với tôi để sử dụng var. Ngoài ra, end() sẽ giữ remove() từ vẫn tiếp tục với DOM ...

$.trim về mặt kỹ thuật không cần thiết, HTML bỏ qua dòng trống.

Vì vậy, trong đó có cách giải quyết trên với regex có ít nhất ba cách để đi - kinda nhắc nhở tôi về Perl;)

Nhờ cả @karaxuna và @Ravi để chia sẻ kinh nghiệm và ý tưởng của họ!

Answer 1

Không cần html()

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

EDIT:

Hãy thử điều này:

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

Answer 2

nếu bạn muốn loại bỏ toàn bộ html. sau đó bạn có thể sử dụng phương thức empty()

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

nếu bạn chỉ xóa hình ảnh. sau đó

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

Answer 3

Đó là muộn, nhưng cố gắng này $('img',$('.teaser')).remove().end().clone()