Javascript性能？ - 將事件放在html標記中，還是綁定它們？

Question

我想知道哪個更適合性能...我有一個“網絡應用程序”的東西。 它有很多javascript。 單擊按鈕時，隱藏的div變為可見。 這個新的div有5個按鈕。 哪個更好的性能：

1.）將按鈕點擊事件放在每個按鈕的html標簽中，如onClick =“alert（'hey'）;” 2.）當div可見時將事件附加到每個按鈕，然后當我隱藏包含按鈕的div時刪除事件？

我問的原因是因為我認為如果html標簽中的事件始終存在，頁面可能會陷入困境。 我認為當用戶可以看到按鈕點擊它們時，頁面可能更快，只有那些事件。

任何幫助都很棒！ 謝謝！

Answer 1

我會使用事件委托 。

這樣，您可以自由添加/刪除任何按鈕，而無需擔心在每個按鈕上附加事件。 這種方法也更節省內存，因為您總是在每個按鈕上直接使用一個事件處理程序而不是N個。

Answer 2

除非這些事件導致某些東西充當鏈接（谷歌似乎學會了閱讀），否則將所有這些JS放在HTML之外。 它使您的代碼更整潔，更易於維護。 無法確定性能。

Answer 3

隱藏元素時保持事件處理程序的注冊將不會影響性能，因為事件不會觸發。

是否使用HTML屬性或DOM來注冊事件處理程序不是性能問題，而是一個簡潔的設計問題。 您希望將演示文稿盡可能與行為分開。 這意味着如果使用屬性，它們應該只將事件綁定到處理程序（即調用單個函數），而不是包含更復雜的代碼。 也就是說，不要：

<button onclick="if ('red'==this.parent.style.backgroundColor) {...}">...</button>

做：

<button onclick="clickColorButton(event)">...</button>