JavaScript讲义记录6

 六.事件
(一)、事件流
1.冒泡型事件
2.捕获型事件
(二)、事件监听
1.IE和Firefox简单的通用方法：(只能添加单一事件)
例如：
windows.onload = function(){
 var oP = document.getElementById("myP");
 oP.onclick = function(){
  alert("我被点击了");
 }
}
2.IE中的事件监听
例如：
function fnClick(){
 alert("我被点击了");
 oP.detachEvent("onclick",fnClick);
}
var oP;
window.onload = function(){
 oP = document.getElementById("myP");
 oP.attacheEvent("onclick",fnClick);
}
3.标准DOM的事件监听(firefox)
function fnClick1(){
 alert("我被fnClick1点击");
 oP.removeEventListener("click",fnClick2,false);
}
function fnClick2(){
 alert("我被fnClick2点击");
}
var oP;
window.onload = function(){
 oP = document.getElementById("myP");
 oP.addEventListener("click",fnClick1,false);
 oP.addEventListener("click",fnClick2,false);
}
(三)、事件对象
1.兼容两种浏览器：
oP.onclick = function(oEvent){
 if(window.event)oEvent = window.event;
}
2.判断事件的类型：
例如：
function handle(oEvent){
 var oDiv = document.getElementById("display");
 if(window.event)oEvent = window.event;
 if(oEvent.type == "click")
  oDiv.innerHTML+="你点击了我";
 else if(oEvent.type == "mouseover")
  oDiv.innerHTML+="你移动到我上方";
}
window.onload = function(){
 var oImg = document.getElementsByTagName("img")[0];
 oImg.onclick = handle;
 oImg.onmouseover = handle;
}
七.表格和表单
(一)动态控制表格
1.动态添加表格
window.onload = function(){
 var oTr = document.getElementById("member").insertRow(2);
 var aText = new Array();
 aText[0] = document.createTextNode("fresheggs");
 aText[1] = document.createTextNode("W610");
 aText[2] = document.createTextNode("100089");
 for(var i=0;i<aText.length;i++){
  var oTd = oTr.insertCell(i);
  oTd.appendChild(aText[i]);
 }
 
}