讓我們說我有一個(gè)空div：<div id='myDiv'></div>這是：$('#myDiv').html("<div id='mySecondDiv'></div>");同樣如下：var mySecondDiv=$("<div id='mySecondDiv'></div>");$('#myDiv').append(mySecondDiv);
3 回答
大話西游666
TA貢獻(xiàn)1817條經(jīng)驗(yàn) 獲得超14個(gè)贊
無論何時(shí)將HTML字符串傳遞給任何jQuery方法，都會(huì)發(fā)生以下情況：
創(chuàng)建一個(gè)臨時(shí)元素，我們稱之為x。x innerHTML被設(shè)置為您傳遞的HTML字符串。然后jQuery將每個(gè)生成的節(jié)點(diǎn)（即x childNodes）轉(zhuǎn)移到新創(chuàng)建的文檔片段，然后它將在下次緩存。然后它將片段childNodes作為新的DOM集合返回。
請(qǐng)注意，它實(shí)際上要復(fù)雜得多，因?yàn)閖Query會(huì)進(jìn)行一系列跨瀏覽器檢查和各種其他優(yōu)化。例如，如果你只是<div></div>通過jQuery()，jQuery將采取一個(gè)捷徑，只是做document.createElement('div')。
編輯：要查看jQuery執(zhí)行的大量檢查，請(qǐng)查看此處，此處和此處。
innerHTML是一般的快的方法，雖然不要讓支配你做什么，所有的時(shí)間。jQuery的方法并不element.innerHTML = ...像我提到的那么簡單- 有一堆檢查和優(yōu)化發(fā)生。
正確的技術(shù)很大程度上取決于具體情況。如果你想創(chuàng)建大量相同的元素，那么你要做的最后一件事是創(chuàng)建一個(gè)大規(guī)模的循環(huán)，在每次迭代時(shí)創(chuàng)建一個(gè)新的jQuery對(duì)象。例如，使用jQuery創(chuàng)建100個(gè)div的最快方法：
jQuery(Array(101).join('<div></div>'));
還要考慮可讀性和維護(hù)性問題。
這個(gè)：
$('<div id="' + someID + '" class="foobar">' + content + '</div>');
......是很多難以維持比這個(gè)：
$('<div/>', {
id: someID,
className: 'foobar',
html: content
});
蠱毒傳說
TA貢獻(xiàn)1895條經(jīng)驗(yàn) 獲得超3個(gè)贊
她們不一樣。第一個(gè)替換 HTML而不首先創(chuàng)建另一個(gè)jQuery對(duì)象。第二個(gè)為第二個(gè)div創(chuàng)建一個(gè)額外的jQuery包裝器，然后將它附加到第一個(gè)div 。
一個(gè)jQuery Wrapper（每個(gè)例子）：
$("#myDiv").html('<div id="mySecondDiv"></div>');
$("#myDiv").append('<div id="mySecondDiv"></div>');
兩個(gè)jQuery Wrappers（每個(gè)例子）：
var mySecondDiv=$('<div id="mySecondDiv"></div>');
$('#myDiv').html(mySecondDiv);
var mySecondDiv=$('<div id="mySecondDiv"></div>');
$('#myDiv').append(mySecondDiv);
你有幾個(gè)不同的用例。如果你想要替換內(nèi)容，那.html是一個(gè)很棒的電話，因?yàn)樗喈?dāng)于innerHTML = "..."。但是，如果您只想附加內(nèi)容，$()則不需要額外的包裝器。
如果您需要div稍后操作添加的，請(qǐng)僅使用兩個(gè)包裝器。即使在這種情況下，您仍然可能只需要使用一個(gè)：
var mySecondDiv = $("<div id='mySecondDiv'></div>").appendTo("#myDiv");
// other code here
mySecondDiv.hide();
添加回答
舉報(bào)
0/150
提交
取消