1,我们先看看this是个什么东西
那么，我们就直接：alert(this);看看这个this指的是什么东西
<script type="text/javascript">
alert(this);//object window,window 是js老大
//window.alert(this);
</script>
这个时候就知道this是object window 。alert(1);是window.alert(1);的简写。所以alert(1);这里前面有个默认的window所以这里的this指向的是object window.
在举个例子
<script type="text/javascript">
function fn1(){
alert(this);
}
window.fn1();
//fn1();
</script>
在函数里面的this也指的是window。
这个时候我们就可以理解this：指的是调用当前 方法（函数）的那个对象
函数的执行有 fn1();还有点击等事件的时候让函数执行
如：
<input type="button" id="btn1" value="button" />
<script>
var oBtn = document.getElementById("btn1");
oBtn.onclick = fn1;//这个函数静静的躺在那里，谁让函数动了，弹出来的就是谁。
</script>
this对当前看的特别重要
<input type="button" id="btn1" value="button" />
<!--alert(this)指的是button，fn1()；指的是window-->
<script>
function fn1(){
alert(this);
}
var oBtn = document.getElementById("btn1");
oBtn.onclick = function(){
//alert(this);//这里的this指的就是button按钮本身
fn1();//这样的话，前面有个老大哥window这种调用方式就是window。
}
</script>
还有一种情况是在元素上直接加事件或者函数，这种情况现在已经是不推荐使用的，但是我们介绍下主要了解this的指向：
如：
<input type="button" id="btn2" onclick="alert(this);" value="button2" />
所以这个里面this是指button
<input type="button" id="btn2" onclick="fn1();" value="button2" /> //fn1()就是上面的一个函数
所以这个里面的this指的是window
这个时候我们总结一下：
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<script>
// this : 这个
// this： 指的是调用 当前 方法（函数）的那个对象
function fn1(){
// this
}
// fn1(); this => window
// oDiv.onclick = fn1; this => oDiv
/*
oDiv.onclick = function (){
fn1(); fn1() 里的this => window
};
<div onclick=" this fn1(); "></div> fn1(); 里的 this 指的是 window
*/
// alert( this ); // object window
// window 是 JS “老大”
// window.alert( this );
function fn1(){
alert( this ); // window
}
// fn1();
// window.fn1();
</script>
</head>
<body>
<input id="btn1" type="button" value="按钮" />
<input id="btn2" type="button" onclick=" fn1(); " value="按钮2" />
<script>
var oBtn = document.getElementById('btn1');
// oBtn.onclick = fn1;
oBtn.onclick = function (){
// this
fn1();
};
</script>
</body>
</html>