Javascript 的 this 关键字总是指向当前被执行函数的所有者。
换句话说，如果当前函数可以视为某个对象的一个方法，那么 this 就指向该对象。
例如有这么一个函数 doSomething()：
function doSomething(){
this.style.color = '#cc0000';
}
如果 doSomething() 定义全局上下文中，那么 this 指向的就是全局变量 window。但是 window 没有 style 属性，所以在全局环境中执行该函数将提示错误。因此使用 this 关键字需要特别注意函数的所有者。
复制
在 JS 的事件处理中，我们要实现 this 关键字正确指向某个页面元素，则必须将函数复制该元素的某个属性上，例如 onclick 属性。
element.onclick = doSomething;
以上代码演示了函数被完整地复制到了 onclick 属性，因此当执行 doSomething 函数时，对应的 element 元素的颜色将发生改变。
引用
当你使用内联事件注册时。
<element onclick="doSomething()">
你没有复制函数，你只是引用了该函数，它们之间的区别十分重要，因为 onclick 属性没有包含任何真正的函数代码，而仅仅是一次函数调用。
它的意思是跳转到 doSomething() 函数并执行它，因此当代码执行到 doSomething() 时，this 其实是指向 window 这个全局对象。
区别
如果你想在事件处理中正确使用 this 访问 HTML 元素，你必须保证 this 关键字真正写入到了 onclick 属性。如果 this 关键字正确写入到了 onclick 属性，那么你输入：
element.onclick = doSomething;
alert(element.onclick)
你会得到
function doSomething() {
this.style.color = '#cc0000';
}
正如你所见，this 关键字在 onclick 方法中，因此它会指向 HTML 元素。
如果你输入的是
<element onclick="doSomething()">
alert(element.onclick)
你会得到
function onclick(){
doSomething()
}
这仅仅是引用到函数 doSomething()，this 关键字并没有出现在 onclick 方法中，因此它不会引用到 HTML 元素。
示例 - 复制
以下情况中，this 都被写入到 onclick 方法中：
element.onclick = doSomething
element.addEventListenser('click', doSomething, false)
element.onclick = function() {this.style.color = '#cc0000'; }
<element onclick="this.style.color = '#cc0000';">
示例 - 引用
以下情况 this 引用到 window：
element.onclick = function () {doSomething() }
element.attachEvent("onclick", doSomething)
<element onclick="doSomething()">
混合
如果想在内联事件注册中使用 this，可以按以下方法实现：
<element onclick="doSomething(this)">
function doSomething(obj) {
obj.style.color = '#cc0000';
}