为什么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函数

http://img.mukewang.com/climg/5e05d1cf09cdb48104210108.jpg

添加后,测试代码,效果实现的很棒,继续加油。

如果我的回答帮助到了你,欢迎采纳,祝学习愉快~

1

0 学习 · 40143 问题

查看课程