版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/qq_20042935/article/details/88366236
JavaScript之this关键字
JavaScript中的 this , 表示当前元素,谁调用的函数,在函数中的this就代表谁。
案例:鼠标进入div和移出div显示不同的文本
效果:
鼠标在外面
鼠标在里面:
代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
var divElement;
//init函数
function init() {
//在页面加载完毕之后,获取
divElement = document.getElementById("div001");
//动态绑定
divElement.onmouseover = over;
divElement.onmouseout = out;
}
//移入事件,把div的呵呵改成 嘿嘿
function over() {
//把div的呵呵 改为嘿嘿
//divElement.innerHTML = "<font size='6' color='red'>嘿嘿</font>";
this.innerHTML = "<font size='6' color='red'>嘿嘿</font>";
}
//移出事件,把dvi中的嘿嘿 又改回呵呵
function out() {
this.innerHTML = "呵呵";
//divElement.innerHTML = "呵呵";
}
</script>
</head>
<body "init()">
<div id="div001" style="border: 1px solid red; background-color: gray; width: 200px; height: 200px;">
呵呵
</div>
</body>
</html>