为什么function Fn(){往里面添加事件,一直执行不了。去掉函数就可以执行了}这是为什么
来源:3-19 编程练习
T_从头开始
2019-12-27 17:29:02
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>mouse</title>
<style type="text/css">
#div{overflow:auto;width:200px;height:200px;border:2px solid gray;margin-bottom:20px;}
#content{width:200px;height:100px;border:2px solid gray;}
</style>
</head>
<body>
<div id="div">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit,
sed do eiusmod,tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam,quis nostrud exercitation ullamco laboris nisi ut aliquip
ex ea commodo,consequat. Duis aute irure dolor in reprehenderit in voluptate velit
esse,cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non,proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
</div>
<div id="content"></div>
<script type="text/javascript">
//补充代码
function Fn() {
/*h获取div标签的DOM对象*/
var div = document.getElementById("div");
/*获取div标签赋值内容的DOM对象*/
var content = document.getElementById("content");
/*当鼠标在拖动滚动条时触发这个事件*/
div.onscroll = function () {
/*通过innerHTML改变HTML标签内容告诉我们内容被拖动了*/
content.innerHTML = "内容被拖动了";
}
/*当鼠标移动时触发这个事件*/
div.onmousemove = function () {
/*只要是移动,内容的字体就变成红色*/
div.style.color = "#f00";
}
/*d当鼠标离开时触发这个事件*/
div.onmouseout = function () {
/*只要是鼠标离开div块,字体就变成绿色*/
div.style.color = "green";
/*HMTL的内容改变成空的*/
content.innerHTML = "";
}
}
</script>
</body>
</html>
1回答
好帮手慕慕子
2019-12-27
同学你好,因为函数不调用就不会执行里面的代码,所以没有效果。建议:调用Fn函数
添加后,测试代码,效果实现的很棒,继续加油。
如果我的回答帮助到了你,欢迎采纳,祝学习愉快~
相似问题