高分求教：如何提取鼠标点击处的ID、name和text等信息？


<html> 
<head>
<script type='text/javascript'> 
document.onmousedown=function(e){
e = e ? e : event;
alert("id = " + e.srcElement.id + "\nclassName = " + e.srcElement.className 
+ "\ninnerHTML = " + e.srcElement.innerHTML
+ "\nname = " + e.srcElement.name);
}
</script> 
</head>
<body>
<div id="div1" style="width:300px;height:100px;border:1px solid black;">11111</div>
<div name="divName2" style="width:300px;height:100px;border:1px solid black;">22222</div>
<div id="div3" name="divName3" style="width:300px;height:100px;border:1px solid black;">33333</div>
</body> 
</html> 

解决方案 »

  1.   

    修改一下,兼容FF浏览器：<html> 
    <head>
    <script type='text/javascript'> 
    document.onmousedown=function(e)
    {
    e = e ? e : event;
    var o = e.srcElement ? e.srcElement : e.target;//兼容FF处理
    alert("id = " + o.id + "\nclassName = " + o.className 
    + "\ninnerHTML = " + o.innerHTML
    + "\nname = " + o.name);
    }
    </script> 
    </head>
    <body>
    <div id="div1" style="width:300px;height:100px;border:1px solid black;">11111</div>
    <div name="divName2" style="width:300px;height:100px;border:1px solid black;">22222</div>
    <div id="div3" name="divName3" style="width:300px;height:100px;border:1px solid black;">33333</div>
    </body> 
    </html> 
      

  2.   

    来一个更狠的，显示全部属性，不过显示的东西看起来有点乱
    第一次发现，javascript 居然还可以加 try{} catch(e){}<html> 
    <head>
    <script type='text/javascript'> 
    document.onmousedown=function(e){
    e = e ? e : event;
    var currentElement = e.srcElement || e.target;
    allPrpos(currentElement);
    }function allPrpos(obj) {
    // 用来保存所有的属性名称和值
    var props = "";
    try{
    // 开始遍历
    for(var p in obj){
    // 方法
    if(typeof(obj[p])=="function"){
    obj[p]();
    }else{
    // p 为属性名称，obj[p]为对应属性的值 
    props += p + "=" + obj[p] + "\t";
    }
    }
    }catch(e){}
    // 最后显示所有的属性
    alert(props);
    }
    </script> 
    </head>
    <body>
    <div id="div1" style="width:300px;height:100px;border:1px solid black;">11111</div>
    <div name="divName2" style="width:300px;height:100px;border:1px solid black;">22222</div>
    <div id="div3" name="divName3" style="width:300px;height:100px;border:1px solid black;">33333</div>
    </body> 
    </html> 
      

  3.   

    try catch 加错地方了。
    如果在循环外面加， FF 下的属性显示不全应该是
    for(var p in obj){
    try{
                // 方法
                if(typeof(obj[p])=="function"){
                    obj[p]();
                }else{
                    // p 为属性名称，obj[p]为对应属性的值 
                    props += p + "=" + obj[p] + "\t";
                }
    }catch(e){}
            }并且把最外面 try catch 那个去掉
      

  4.   

    晕，JS本身就可以用try catch现在才发现
    捕捉错误的时候经常用到
      

  5.   

    的确是才发现
    网上找的 function allPrpos(obj) 里有 try catch
    而我接触过的其他代码中，从来没出现过
      

  6.   

    遇到错误，一般用 alert() ，来查看哪里出错了
    所以只能说 JS 博大精深啊