jQuery，獲取整個元素的html

我希望獲取選定元素的整個html，而不僅僅是它的內容。 .html（）根據文檔使用javascripts innerHTML（）方法。 HTML：jQuery，獲取整個元素的html

<div id="divs"> 
    <div id="div1"> 
    <p>Some Content</p> 
    </div> 
    <div id="div2"> 
    <p>Some Content</p> 
    </div> 
</div>

使用$('#divs:first').html();將返回剛纔的段落元素。我想要得到的HTML整個元素，像這樣：

<div id="div1"> 
    <p>Some Content</p> 
    </div>

我不能使用.parent，因爲這將返回兩個孩子的div的HTML。

來源

2010-09-01 Keyo

171

您可以克隆它得到的全部內容，就像這樣：

var html = $("<div />").append($("#div1").clone()).html();

或使其一個插件，多數人傾向於稱之爲「outerHTML」，像這樣：

jQuery.fn.outerHTML = function() { 
    return jQuery('<div />').append(this.eq(0).clone()).html(); 
};

然後您可以撥打電話：

var html = $("#div1").outerHTML();

來源

2010-09-01 00:28:52

這是一個很好的答案，但它真的很糟糕，jQuery沒有實現它自己的方法。 – 2011-04-05 07:51:27

這並不完美。如果HTML有一個'script'標籤，當調用append時，這個標籤的代碼將會運行。這可能會導致問題。 – Andrej 2014-02-13 16:17:57

差異在典型用例中可能沒有意義，但使用標準DOM功能兩者均

$("#el")[0].outerHTML

大約快兩倍，

$("<div />").append($("#el").clone()).html();

所以我會去：

/* 
* Return outerHTML for the first element in a jQuery object, 
* or an empty string if the jQuery object is empty; 
*/ 
jQuery.fn.outerHTML = function() { 
    return (this[0]) ? this[0].outerHTML : ''; 
};

來源

2013-08-08 01:29:02

如果你只想要開始標籤：'/ <[^>] +> /。exec（elem [0] .outerHTML）[0]' – z0r 2014-11-19 02:23:16

恕我直言，這應該是公認的答案 - 特別是考慮.clone（）性能影響 – gciochina 2017-02-27 18:24:51

我還喜歡默認爲空字符串，而不是允許空引用錯誤，好和短，甜美和穩定，謝謝。這對我很好。 – 2018-02-20 22:15:30

你可以很容易地得到孩子本身及其所有的死者（兒童）與jQuery的克隆（）方法，只是

var child = $('#div div:nth-child(1)').clone(); 

var child2 = $('#div div:nth-child(2)').clone();

你會得到第一個查詢問題

<div id="div1"> 
    <p>Some Content</p> 
</div>

來源

2014-03-04 13:47:13

你可以實現只有一個行代碼。

$（'＃divs'）。get（0）.outerHTML;

就這麼簡單。

來源

2017-02-26 13:59:57

這對我很好，謝謝。 – 2018-02-20 22:14:07

-1

寫你的HTML這樣的：

<div id="element"> 
    <img src="image.jpg"> 
</div>

那麼的.html（）函數來獲取img標籤！，你可以追加到任何地方。:)

來源

2017-04-05 07:38:29

jQuery，獲取整個元素的html

回答

相關問題