對於如何使用jQuery的HTML（）在特定的子元素

Question

我試圖使用jquery的html()功能於諸如特定子：

<div id="main"> 
    <p>I am p tag</p> 
    <span> i am span tag</span> 
</div> 

現在，如果我們用$("#main").html()它給雙方p和span但如果我只想要p，我該怎麼辦？

Answer 1

嘗試像下面，

$("#main p").html() 

這會給我，我p標籤，但我想<p> I am p tag</p>

下面嘗試使用outerHTML，

$('#main p')[0].outerHTML 

或者你可以使其成爲jQuery函數，以便您可以鏈接。

jQuery.fn.outerHTML = function(s) { 
    var _this = this[0]; 
    return _this.outerHTML?_this.outerHTML:(s ? this.before(s).remove() : jQuery("<p>").append(this.eq(0).clone()).html()); 
}; 

$('#main p').outerHTML() 

DEMO：http://jsfiddle.net/skram/PMjKR/1/

編號：根據您的具體要求Get selected element's outer HTML

Answer 2

方法很多。

標準的CSS選擇器：

$('#main p').html(); 

對兒童進行過濾。

$('#main').children('p').html(); 

通過讓主

$('#main:first-child').html(); 

編輯 的第一個孩子通過OP對另外一個答案看到評論後，我會簡單地添加其中的HTML（）與[0] .outerHTML

更換

請參閱selectors here