Javascript 中的 this 和 event.srcElement 的区别
学习交流，欢迎转载。转载请注明文章来源：http://www.cnblogs.com/lgjspace/archive/2011/08/09/2131643.html
window.event.srcElement 属性可以用来获得触发事件的源对象，我自己碰到过的用得最多的其中一个场合就是：在需要让多个事件共享一个事件响应函数时，可以遍历所有相关的对象，把每个相关对象和 window.event.srcElement 对象进行比较，如果相等，则说明该相关对象就是触发事件的源对象，否则则不是事件的触发源。
而 this 的用法很多，其中和 srcElement 最为相似的一个用法是：在事件的响应函数中可以用 this 来表示发生事件的控件，但这有一个很重要的限定条件，必须在事件响应函数中使用 this 才有这样的功效，在事件响应函数中所调用的函数里头使用 this 就没有了这种指代效果。为了后面更好地说明 this 和 window.event.srcElement 的区别，可以看看本人的一篇相关文章《js 中 this 用作“指代发生事件的源对象”时的适用范围》先了解一下 “事件响应函数” 和 “事件响应函数所调用的函数” 的区别。
如果单从上面的简单描述来看，this 和 window.event.srcElement 两者好像没什么不一样，其实区别还是有的。为了更容易理解，先列出下面这段代码，结合代码谈一谈它们的一些区别：
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2 <html xmlns="http://www.w3.org/1999/xhtml">
3 <head>
4 <title></title>
5 </head>
6 <body onclick = "alert('this.tagName = ' + this.tagName + '，event.srcElement.tagName = ' + event.srcElement.tagName);">
7 <div onclick = "alert('this.tagName = ' + this.tagName + '，event.srcElement.tagName = ' + event.srcElement.tagName);">
8 <table onclick = "alert('this.tagName = ' + this.tagName + '，event.srcElement.tagName = ' + event.srcElement.tagName);">
9 <tbody onclick = "alert('this.tagName = ' + this.tagName + '，event.srcElement.tagName = ' + event.srcElement.tagName);">
10 <tr onclick = "alert('this.tagName = ' + this.tagName + '，event.srcElement.tagName = ' + event.srcElement.tagName);">
11 <td onclick = "alert('this.tagName = ' + this.tagName + '，event.srcElement.tagName = ' + event.srcElement.tagName);">
12 第 01 行 第 01 列
13 </td>
14 </tr>
15 </tbody>
16 </table>
17 </div>
18 </body>
19 </html>
这段代码十分简单，就是一个简单的事件冒泡代码。页面中的 body 标签中一次嵌套 div、table、tbody、tr、td，分别在这些元素标签中添加响应事件代码，分别用
this 和 window.event.srcElement 来实现打印元素自身的标签名。运行该页面代码，鼠标点击文本“第 01 行 第 01 列”，页面会依次弹出窗口，依次打印显
示：“this.tagName = TD，event.srcElement.tagName = TD”、“this.tagName = TBODY，event.srcElement.tagName = TD”、“this.tagName = TABLE，
event.srcElement.tagName = TD”、“this.tagName = DIV，event.srcElement.tagName = TD”和“this.tagName = BODY，event.srcElement.tagName = TD”。在这里插个题外话，这打印结果比较奇怪，整个事件冒泡过程没有触发到 TR 元素的 onclick 事件，个人估计是由于 TR 有自身的特殊性，它并不指代一种元素实体，只是限定布局位置的元素，然而，真正原因还有待查证，毕竟这不是本文讨论的重点。
从打印的结果可以清楚对比得出，随着事件的逐渐往外层冒泡，用 this 方式来获取的元素对象也随着引发事件的元素的改变而改变，而用 window.event.srcElement 方式来获取的元素对象则一直都只是 最里层的 TD，即最原始的触发源的元素对象。
由以上的对比和描述不难得出 this 和 event.srcElement 两者之间的区别，下面再简单总结一下两者的不同：
1. this 是 javascript 的关键字，而 window.event.srcElement 则是 DOM 中的一个属性。
2. this 必须只有在事件响应函数中使用才会有 “表示当前发生事件的控件” 的指代效果，而 event.srcElement 则在任何位置下引用都能指代触发事件的事件源。
3. this 指代的只是当前引发（发生）事件的控件对象，而不一定是触发事件的最原始的事件源对象，而 event.srcElement 则只固定指代最原始的触发事件的事件源对象。
这些都是个人学习总结得出的结论，不敢保证完全正确，如有任何错漏，肯定各位高手不吝回帖指点，欢迎拍砖！
