事件代理中表格tr的获取问题？？

前几天看了 司徒大侠 的 《js事件代理》。练习一下，于是又了下面的代码和问题。（本来是鼠标滑动到行的时候，该行变色）

 

代码 
 
<!doctype html>
<html dir="ltr" lang="zh-CN">
  <head>
    <meta charset="utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=Edge">
    <script type="text/javascript"ot;color: #0000ff;">>

      window.onload = function(){
        var nav = document.getElementById('tab');
        nav.onmouseover = function () {
          var e = arguments[0] || window.event,
          target = e.srcElement ? e.srcElement : e.target;
          if(target.nodeName.toLowerCase() == 'td')
          {
            alert(target.innerHTML);
          }
        }
      }
    </script>
    <title>delegate</title>
  </head>
  <body>
    <div id="wrapper">
        <table id="tab">
            <tr id="tr">
                <td>我是td</td>
                <td>我是td</td>
                <td>我是tdle="color: #0000ff;"></td>
                <td>我是td</td>
                <td>我是td</td>
            </tr>
            <tr>
                <td>我是td</td>            
                <td>我是td</td>            
                <td>我是td</td>            
                <td>我是td</td>
                <td>我是td</td>
            </tr>
            <tr>
                <td>我是td</td>
                <td>我是td</td>
                <td>我是td</td>
                <td>我是td</td>
                <td>我是td</td>
            </tr>
        </table>
    </div>
  </body>
</html>

 

 

   if(target.nodeName.toLowerCase() == 'table')
或者 if(target.nodeName.toLowerCase() == 'td')
都能获取到目标，但是tr就不行。按照冒泡的规则，当点击td 之后应该冒泡到tr ，然后才到table。 
我把代码给一下：

   if(target.nodeName.toLowerCase() == 'table')或者 if(target.nodeName.toLowerCase() == 'td')

都能获取到目标，但是tr就不行。

按照冒泡的规则，当鼠标在td 上，之后应该冒泡到tr ，然后才到table。

 

 
我把代码给一下：

 

代码 
    <script type="text/javascript">

      window.onload = function(){
        var nav = document.getElementById('tr');
        nav.onmouseover = function () {
          var e = arguments[0] || window.event,
          target = e.srcElement ? e.srcElement : e.target;
          if(target.nodeName.toLowerCase() == 'td')
          {
            alert(target.innerHTML);
          }
        }
      }
    </script>

 

结果tr 还是不行，td 还是可以。

 

所以比较迷惑，难道tr 真的特殊一点吗？

posted @ 2010-06-04 22:10  nick_lsf  阅读(812)  评论(3)  编辑  收藏  举报