事件的传递 event 冒泡处理

与Netscape相反，IE中的事件传递方向是从事情发生的对象开始，然后依次由该对象向所在的父节点传递。

 <div>
     <table nclick="gotClick(event,'table',this)" id="table">
      <tr nclick="gotClick(event,'tr',this)" id="tr">
       <td nclick="gotClick(event,'td',this)" id="td">
        <input type="button" name="button" value="单击我"
        onclick="gotClick(event,'按钮',this);" id="button">
       </td>
      </tr>
     </table>
    </div>
    <div id='result'>
    </div>

js文件

function gotClick(event,msg,obj){
 var object;
 var msgs = msg+" => 被单击了!<br/>";
 try{
  if (event.target) {//Mozilla
   object = event.target;
  // alert(document.getElementById(object.id).nodeName+" Mozilla "+msg);
   document.getElementById('result').innerHTML +=msgs;
 //  event.cancelBubble=true;//阻止传递
  }
  else if(event.srcElement){//IE
   object = event.srcElement;
  // alert(object.id+" IE "+msg);
 //  event.cancelBubble=true;//阻止传递
   document.getElementById('result').innerHTML +=msgs;
  }
 }catch(e){
  alert(e);
 }
 
}

运行结果是:

 按钮 => 被单击了!
td => 被单击了!
tr => 被单击了!
table => 被单击了!