????????在JavaScript中，添加到頁面的事件處理程序數(shù)量直接關(guān)系到頁面的整體運(yùn)行性能镐捧，主要原因?yàn)椋菏紫龋總€函數(shù)都是對象臭增，都會占用內(nèi)存懂酱，內(nèi)存中的對象越多，性能就越差誊抛。其次必須事先指定所有時間處理程序而導(dǎo)致的DOM訪問次數(shù)列牺，會延遲整個頁面的交互就緒時間。
1.事件委托
????????對“事件處理程序過多”的解決方案就是事件委托芍锚。事件委托利用了事件的冒泡昔园，只指定一個事件處理程序，就可以管理某一類型的所有事件并炮。優(yōu)點(diǎn)如下：
????????·??document對象很快就可訪問，可以在頁面生命周期的任何時間點(diǎn)上為他添加事件處理程序（無需dengdai DOMContentLoaded或load事件）甥郑。
????????·??在頁面設(shè)置事件處理程序所花的事件更少逃魄，只添加一個事件處理程序所需的DOM引用更少，所花的事件也更少澜搅。
????????·??整個頁面站用的內(nèi)存空間更少伍俘，能夠提升整體性能邪锌。
<!-- html代碼 -->
<ul id = "someone">
<li id = "name"> name </li>
<li id = "age"> age </li>
<li id = "address"> address </li>
</ul>
//js代碼
var person = document.getElementById("someone");
person.addEventListenter("click",function(event){
switch(event.target.id){
case "name":
document.title = '''title changed';
break;
case "age":
location.;
break;
case "address":
alert("address");
break;
}
};
2.移除事件處理程序
????????在不需要的時候移除事件處理程序，也是解決上述問題的一個方案癌瘾。內(nèi)存中那些過時不用的“空事件處理程序”(dangling event handler)也是造成Web用用程序內(nèi)存性能問題的主要原因觅丰。導(dǎo)致空事件處理程序兩種情況：
第一種：從文檔中移除帶有事件處理程序的元素時。
<div id = "myDiv">
<input type = "button" value = "Click me" id = "myBtn">
</div>
<script type = "text/javascript">
var btn = document.getElementById("myBtn");
btn.onclick = function(){
//do something
btn.onclick = null; //移除事假能處理程序
document.getElementById("myDiv").innerHTML = "processing...";
}
在事件處理程序中刪除按鈕也能阻止事件冒泡妨退，目標(biāo)元素在文檔中是事件冒泡的前提妇萄。
第二種：頁面卸載的時候
頁面被卸載之前沒有清理干凈事件處理程序，那他們就會滯留在內(nèi)存中咬荷，一般來說冠句，歲好的做法是在頁面卸載之前，先通過unload時間處理程序移除所有事件的處理程序幸乒。
