2012-06-01 38 views
5

我有兩個div元素在另一個。有時,從用戶交互性,這兩個項目被刪除,並放置兩個新的元素。正確的方法來刪除和添加新的HTML與jQuery

先刪除現有元素是否合適?或者只是覆蓋HTML?或者它甚至很重要?

$('#item1').remove(); 
$('#item2').remove(); 
$('#itemWindow').append(newItem1); 
$('#itemWindow').append(newItem2); 

或者乾脆

$('#itemWindow').html(newItem1); 
$('#itemWindow').append(newItem2); 

一個是更少的代碼,而應該把該項目,而不是刪除?這些項目沒有任何聽衆,但如果他們確實這樣做有所作爲?

我是一名ActionScript開發人員,潛入JS和jQuery。在AS中,如果存在任何監聽器,則首先刪除該項目以斷開與該對象的任何連接以進行適當的內存收集是合適的。這些規則與JS和jQuery一樣嗎?

謝謝!

+0

我認爲關於聽衆的答案將取決於您是否希望重用偵聽器... – Jared

+2

如果您查看jQuery源代碼,您會注意到html()方法的工作方式類似於> this.empty( ).append(值)。你正在複雜的地方你不需要;-)用於更短的代碼,像> $('#itemWindow')。html(newItem1).append(newItem2); –

回答

3

他們沒有區別。所以你可以繼續使用第二種方法。當您使用此

$('#itemWindow').html(newItem1); 

$('#item1')$('#item2')將被替換。所以你可以跳過去除那些手動。

正如@glavić在評論中提到,如果你看一下jQuery的源html方法的定義在這裏https://github.com/jquery/jquery/blob/master/src/manipulation.js#L213 你會發現它有這些行

if (elem) { 
    this.empty().append(value); 
} 

如果在這種情況下elem是真的結束。所以元素將是emptied,然後新元素將是appended

如果他們有聽衆,那麼你必須綁定聽衆的方式,因此與動態添加元素的工作原理是利用$.on

0

$(「#物品1」)刪除()。將刪除id爲item1的元素

$('#item1')。html(newItem1);將設置元素中的HTML與id項目1

0

如果你想具體說明你實際上要刪除什麼,例如說,如果你有一個元素需要被刪除,但沒有其他,那麼我建議第一種方法。如果你只是每次都要更換所有東西,那麼可以隨意使用,或者,唯一的問題就是更適合你的東西。

0

如果item有任何監聽器,那麼第一種方法更合適。 .remove()刪除項目本身和所有綁定事件。如果項目被刪除,但不是事件,將來可能會發生錯誤。但如果沒有有限的事件,可以使用第二種方法 - 減少代碼。