zoukankan      html  css  js  c++  java
  • 关于window.event.srcElement 和 window.event.target(触发事件的对象)

    转自:https://www.cnblogs.com/zhilingege/p/7423817.html

    window.event.srcElement   是指触发事件的对象

    <script LANGUAGE="JavaScript">

    <!--

    function mm()

    {

    var str = "";

    for (mm in window.event.srcElement)

    str += mm+"="+ window.event.srcElement[mm] +"/n"; //得到 srcElement 的所有属性

    alert(str);

    }

    //--></s cript>

    event.srcElement就是指向触发事件的元素,他是什么就有什么的属性

    srcElement 是事件初始目标的html元素对象引用,因为事件通过元素容器层次冒泡,可以在任一层进行处理,所以由一个属性指向产生初始事件的元素是很有帮助的.有了元素的引用,就可以读/写改元素的属性,并调用他的任何方法.

    =====================================================================

    <div >
    <input type="button" value="父元素标签"

    onclick="alert(event.srcElement.parentNode.tagName)">
    </div>


    event.srcElement有关问题- -

    event.srcElement的子标签 和父标签:

    第一个子标签为
    event.srcElement.firstChild
    最后个一个子标签是
    event.srcElement.lastChild
    当然也可以用
    event.srcElement.children[i]
    event.srcElement.ChildNode[i]
    至于event.srcElement.parentElement是指在鼠标所在对象的上一个对象.

    完整示例如下:
    ---------------------------------------------------------------------<html>    <body>

    <script>

    function a()

    { alert("您点击的标记是:" + event.srcElement.tagName) }

    </script>

    <body onclick="a()">

    点鼠标测试<br>

    <input><a href=#>test</a>

    <div>测试div: </div>

    <p>测试p: </p>

    <span>测试span: </span><br /><br />

    <span>

    <a href="/" onmouseover="alert(event.srcElement.parentElement.tagName);">放在我上面</a>

    </span>

    </body>        </html>

    范例2:

    <html>              <body>

    <script language="JavaScript">

    function f()

    {

       alert('index.asp'+event.srcElement.title)

       location.href='index.asp'+event.srcElement.title

    }

    </script>

    <input type=button value=Go title="?page=1" onclick=f()>

    <a title="a测试" onclick="alert(event.srcElement.title)" >a测试</a>

    <br>

    <table border=1 width="200">

    <tr title="tr测试" onclick="alert(event.srcElement.parentElement.title)"><td>tr</td></tr>

    </table>

    <table border=1 width="200">

    <tr><td title="td测试" onclick="alert(event.srcElement.title)">td</td></tr>

    </table>

    <select name="selectname" onchange="alert(event.srcElement.options[event.srcElement.selectedIndex].value)" >

    <option value="1">1</option>

    <option value="2">2</option>

    <option value="3">3</option>

    <option value="4">4</option>

    <option value="5">5</option>

    </select>

    </body>           </html>

    ---------------------------------------------------------------------

    可以调用的方法还有:

    event.srcElement.id
    event.srcElement.tagname
    event.srcElement.type
    event.srcElement.value
    event.srcElement.name
    event.srcElement.classname
    event.srcElement.parentelement
    event.srcElement.getattribute
    event.srcElement.children
    event.srcElement.lastChild
    event.srcElement.ChildNode
    event.srcElement.selectedIndex

    =====================================================================

  • 相关阅读:
    第002篇 深入体验C#项目开发(一)
    C#编程打字指法练习
    第001篇——C#学习计划开启
    2020杭电多校第一场(待更新)
    LeetCode双周赛11
    LeetCode双周赛10
    LeetCode Weekly 156
    NOIP模板复习(4)区间操作之莫队算法,树状数组,线段树
    NOIP模板复习(3) 最短路三巨头Floyd,Dijkstra与SPFA
    NOIP模板复习(2) LCA的三种解法
  • 原文地址:https://www.cnblogs.com/sharpest/p/6503507.html
Copyright © 2011-2022 走看看