這是dom操縱？

Question

我知道大量的DOM操作是不好的，因爲它會導致重新繪製等。

而是做這樣的事情

var container = $('<div />'); 
{repeat:20} 
container.append(<div>content</div>); 
{endrepeat} 
$('#actualElement').html(container.html()); 

即使它不是DOM操作，這樣做不好呢？

Answer 1

不，這很好，因爲container未附加到DOM。這是將大量元素添加到DOM的首選方法。
但是通過使用html()，您將失去所有事件處理程序或您添加到元素中的data。如果你想留住他們，可以考慮使用此：

$('#actualElement').empty().append(container.children()); 

你也可以使用一個DocumentFragement，而是因爲你是使用jQuery，我會用jQuery堅持。回答實際問題：是的，它是DOM操作，但是你只向DOM中添加一次，這是最好的（除了沒有插入;））。

Answer 2

那麼，當然你通過插入和創建新節點來操縱DOM。這很可能導致迴流，這很慢，但可能不是「壞」。

如果您想創建/更改標記，則需要進行折衷。

正如我在我的評論中提到的，從「好」或「壞」的角度考慮它可能是錯誤的。如果你想通過DOM在飛行中改變某些東西，那麼在某些時候沒有辦法迴流。只有你可以做的是，避免不必要的迴流/重做只做一個DOM訪問並在內存中完成其餘的工作。

Answer 3

不，它不壞。

或者，它不比關於重繪的DOM操作更差（或更好）。其實，你的是操縱DOM。

假設你不只是操縱DOM的樂趣，你可能會有這樣做的目的。如果有其他解決方案不需要你進行DOM操作，那麼這些解決方案可能會更好，但如果沒有（或者你找不到它們），如果它完全符合你的需求，該解決方案又怎麼會是錯誤的？ ？

Answer 4

是的，這是DOM操作。但它可能比逐個插入組件的速度更快。

但在大多數瀏覽器中，只應重繪/重新焊接一次（插入構建的結構時）。

儘管如此，您應該對它進行基準測試，並將其與其他選項（如將HTML插入爲字符串）進行比較。