`

event.srcElement 与event.target

阅读更多
哦,原来是用来捕获当前事件作用的对象的。
event.srcElement.tagName可以捕获活动标记名称。
注意获取的标记都以大写表示,如‘TD’,'TR','A'等。
抄录下来,不记得来看看。
<script type="text/javascript">

    function tdclick(){

        if(event.srcElement.tagName.toLowerCase()=='td')

             alert("行:"+(event.srcElement.parentNode.rowIndex+1)+"列:"+(event.srcElement.cellIndex+1));

     }

  </script>

event.srcElement从字面上可以看出来有以下关键字:事件,源     他的意思就是:当前事件的源,

我们可以调用他的各种属性 就像:document.getElementById("")这样的功能,

经常有人问 firefox 下的 event.srcElement 怎么用,在此详细说明:

IE下,event对象有srcElement属性,但是没有target属性;Firefox下,event对象有target属性,但是没有srcElement属性.但他们的作用是相当的,即:

firefox 下的 event.target = IE 下的 event.srcElement

解决方法:使用obj(obj = event.srcElement ? event.srcElement : event.target;)来代替IE下的event.srcElement或者Firefox下的event.target.

以下是几种常见到的情况(IE下测试通过,如要测试firefox下的event.target可以修改并保存代码后用firefox打开测试):



event.srcElement.X显示一个控件的各种属性
<div id="div_001">

<form id="form_001">

<input type="button" id="button_001_id" name="button_001_Name" value=" 单击查看" class="button_001_Class" onclick="Get_srcElement(this)">
</form>
</div>

<script>...
function Get_srcElement()
{
var srcElement=""

srcElement = srcElement + " " +  "event.srcElement.id : " + event.srcElement.id
srcElement = srcElement + " " +  "event.srcElement.tagName : " + event.srcElement.tagName
srcElement = srcElement + " " +  "event.srcElement.type : " + event.srcElement.type
srcElement = srcElement + " " +  "event.srcElement.value : " + event.srcElement.value

srcElement = srcElement + " " +  "event.srcElement.name : " + event.srcElement.name

srcElement = srcElement + " " +  "event.srcElement.className : " + event.srcElement.className

srcElement = srcElement + " " +  "event.srcElement.parentElement.id : " + event.srcElement.parentElement.id

srcElement = srcElement + " " +  "event.srcElement.getattribute : " + event.srcElement.getAttribute

alert(srcElement)
}



</script>



event.srcElement.selectedIndex一般使用在select对像上:
<select name="selectname" onchange="alert(event.srcElement.options[event.srcElement.selectedIndex].value)" >

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

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

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

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

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

</select>


第一个子标签为

event.srcElement.firstChild

最后个一个是

event.srcElement.lastChild

当然也可以用

event.srcElement.children[i]

event.srcElement.ChildNode[i]

至于event.srcElement.parentElement是指在鼠标所在对象的上一个对象.

<div onclick="Get_srcElement()">
<div id="001" style="border:1px solid red;width:100%;height:500px"> <span id="node001">这是第1结点div001<span>

  <div id="002" style="border:1px solid red;width:80%;height:300px"> <span id="node002">这是第2结点div002<span>

   <div id="003" style="border:1px solid red;width:50%;height:200px"> <span id="node003">这是第3结点div003<span>

   </div>

    <div id="004" style="border:1px solid red;width:50%;height:200px"> <span id="node003">这是第3结点div004<span>

    </div>

  </div>

</div>

<script>

function Get_srcElement()
{

var srcElement=""

srcElement = srcElement + " " +  "event.srcElement.children[0].tagName: " + event.srcElement.children[0].tagName

srcElement = srcElement + " " +  "event.srcElement.firstChild.id : " + event.srcElement.firstChild.id

srcElement = srcElement + " " +  "event.srcElement.lastChild.id : " + event.srcElement.lastChild.id

alert(srcElement)
}

</script>

</div>

*****************************************************************************************************

<div style="border:10px red solid">

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

</div>

event.srcElement有关问题- -

                                     

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

第一个子标签为

event.srcElement.firstChild

最后个一个是

event.srcElement.lastChild

当然也可以用

event.srcElement.children[i]

event.srcElement.ChildNode[i]

至于event.srcElement.parentElement是指在鼠标所在对象的上一个对象.

</span>

</body>

\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\

<input type=button value=GO title="?page=1"

<script language="JavaScript">

function f()

{

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

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

}

</script>

<a title="a测试" >a测试</a>

<br>

<table border=1 width="200">

<tr title="tr测试" ><td>tr</td></tr>

</table>

<table border=1 width="200">

<tr><td title="td测试" >td</td></tr>

</table>

<select >

<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>
分享到:
评论

相关推荐

    event和srcElement说明,方法,技巧

    #### 三、event.srcElement与event.target 在IE中,`event.srcElement`表示触发事件的原始DOM元素。而在Firefox等其他现代浏览器中,则使用`event.target`来获取触发事件的元素。这两个属性的作用是相同的,即返回...

    js中的触发事件对象event.srcElement与event.target详解

    例如,如果想要获取触发事件的元素的ID,可以使用event.srcElement.id或event.target.id。 在处理DOM树中的元素时,我们常常需要找到一个元素的父节点、子节点或同级节点等。使用event.srcElement的父亲节点...

    event.srcElement 用法笔记e.target

    `event.srcElement` 是在JavaScript中处理DOM事件时的一个属性,主要用于获取触发事件的元素。...在编写跨浏览器的事件处理代码时,需要考虑`event.srcElement`与`event.target`之间的差异,并采取适当的兼容性策略。

    替代window.event.srcElement效果的可兼容性的函数

    在JavaScript编程中,特别是在处理事件时,`window.event` 是一个内置对象,它提供了与当前事件相关的各种信息,如事件的目标元素(`event.srcElement` 在IE中,`event.target` 在非IE浏览器中)。然而,`window....

    js事件源window.event.srcElement兼容性写法(详解)

    在IE浏览器中,可以通过`window.event.srcElement`来获取事件源,而在Firefox和其他遵循W3C标准的浏览器中,应使用`event.target`。 `window.event.srcElement`是IE特有的,它返回的是当前事件的源对象,即触发事件...

    IE event.srcElement和FF event.target 功能比较

    在JavaScript事件处理中,`event.srcElement` 是 Internet Explorer 浏览器特有的属性,用于获取事件发生时的源元素,而 `event.target` 是在 Firefox、Chrome、Safari 和其他遵循 W3C 规范的浏览器中使用,作用相同...

    window.event.srcElement 得到事件源对象

    虽然在标准的DOM事件模型中,这个属性被`event.target`所替代,但在兼容旧版IE(尤其是IE8及以下版本)的代码中,`srcElement`仍然是一个实用的属性。 `window.event` 是IE浏览器特有的全局事件对象,它包含了与...

    HTML在IE浏览器和FF浏览器中标签的使用

    - **event.srcElement与event.target**:IE使用srcElement,FF使用target。使用`obj = event.srcElement ? event.srcElement : event.target`进行兼容。 - **event.toElement与relatedTarget**:IE有toElement,FF...

    JS中的THIS和WINDOW.EVENT.SRCELEMENT详解

    var target = event.target || event.srcElement; // 兼容标准浏览器和旧版IE // 根据事件和目标元素来执行相应的逻辑 } ``` 总结来说,`this`关键字和`window.event.srcElement`在JavaScript事件处理中扮演了...

    JavaScript中解决多浏览器兼容性23个问题的快速解决方法

    10. event.srcElement与event.target问题:在IE浏览器中,event对象有srcElement属性,但在Firefox浏览器中,event对象有target属性。为了解决这一兼容性问题,可以使用srcObj=event.srcElement?event.srcElement:...

    parentElement,srcElement的使用小结

    在JavaScript中,`parentElement` 和 `srcElement` 是与事件处理有关的两个属性,它们在处理DOM元素和事件流时非常有用。本文将详细解释这两个属性以及它们在实际应用场景中的使用。 首先,`parentElement` 是一个...

    javascript快捷键

    window.open(event.srcElement.url, event.srcElement.getAttribute("target")); } else { window.location = event.srcElement.url; } } } ``` 这段JavaScript代码实现了几个核心功能: 1. **显示菜单**:`...

    JavaScript兼容浏览器FFIE技巧[定义].pdf

    3. **事件源(target与srcElement)**: - IE中的event.srcElement对应FF中的event.target。解决方案:`var obj = event.srcElement ? event.srcElement : event.target;` 4. **事件目标(toElement)**: - 解决...

    同时兼容IE和FireFox的事件处理event代码--添加文件上传例子

    var files = event.target.files || event.srcElement.files; // 处理文件 } ``` 在这个压缩包中,`upload.html`可能是一个包含了文件上传功能的HTML页面,而`js`文件可能是对应的JavaScript代码,实现了上述的...

    javascriptYUI.pdf

    - `event.srcElement`:在事件处理函数中,`event.srcElement`指的是触发事件的元素,相当于IE中的`event.target`。 - `event.srcElement.tagName` 和 `event.srcElement.type`:获取事件源元素的标签名和类型。 ...

    利用jQuery的$.event.fix函数统一浏览器event事件处理

    例如,在Internet Explorer(IE)浏览器中获取触发事件的元素引用使用的是event.srcElement属性,而在基于Gecko引擎的FireFox(FF)浏览器中使用的是event.target属性。类似这样的差异性,还包括获取鼠标光标相对...

Global site tag (gtag.js) - Google Analytics