4-4 编程练习

4-4 编程练习

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>screen</title>
        <style type="text/css">
            
        </style>
    </head>
    <body>
        <input type="button" value="当前显示屏幕宽度">
        <input type="button" value="当前显示屏幕高度">
        <input type="button" value="当前窗口文档显示宽度">
        <input type="button" value="当前窗口文档显示高度">      
    </body>
     <script type="text/javascript">
        //补充代码
        function w(){
            alert(screen.availWidth);
        }
        function h(){
            alert(screen.availHeight);
        }
        var b = document.getElementsByTagName('input');
        b[0].addEventListener('click',w()); 
        b[1].addEventListener('click',h());
        b[2].addEventListener('click',function a(){alert(screen.innerWidth)});
        b[3].addEventListener('click',function c(){alert(screen.innerHeight)});   
     </script>
</html>


正在回答 回答被采纳积分+1

登陆购买课程后可参与讨论,去登陆

3回答
好帮手慕阿莹 2018-08-12 11:54:58

如果不写到函数里,会在加载页面的时候直接加载。绑定了点击事件后,点击按钮执行该函数。

如果我的回答解决了你的问题,请采纳,祝学习愉快.

提问者 MOCKINGT 2018-08-10 23:59:22
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>screen</title>
        <style type="text/css">
            
        </style>
    </head>
    <body>
        <input type="button" value="当前显示屏幕宽度">
        <input type="button" value="当前显示屏幕高度">
        <input type="button" value="当前窗口文档显示宽度">
        <input type="button" value="当前窗口文档显示高度">      
    </body>
     <script type="text/javascript">
        //补充代码
        var b = document.getElementsByTagName('input');
        b[0].addEventListener('click',function(){alert(screen.availWidth)}); 
        b[1].addEventListener('click',function(){alert(screen.availHeight)}); 
        b[2].addEventListener('click',function(){alert(innerWidth)}); 
        b[3].addEventListener('click',function(){alert(innerHeight)});    
     </script>
</html>

为什么函数写到里面就不会一上来就执行?

  • 提问者 MOCKINGT #1
    而这样 <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title>screen</title> <style type="text/css"> </style> </head> <body> <input type="button" value="当前显示屏幕宽度"> <input type="button" value="当前显示屏幕高度"> <input type="button" value="当前窗口文档显示宽度"> <input type="button" value="当前窗口文档显示高度"> </body> <script type="text/javascript"> //补充代码 var b = document.getElementsByTagName('input'); function e(){ alert('abc'); } b[0].addEventListener('click',e()); b[1].addEventListener('click',function(){alert(screen.availHeight)}); b[2].addEventListener('click',function(){alert(innerWidth)}); b[3].addEventListener('click',function(){alert(innerHeight)}); </script> </html> 一上来就会执行直接出现一个alert
    2018-08-11 00:01:59
  • 提问者 MOCKINGT #2
    没排版,就是先声明函数再调用就会被执行
    2018-08-11 00:03:00
提问者 MOCKINGT 2018-08-10 23:50:23

一上来就直接显示了,后面的两个都是undefined

  • 提问者 MOCKINGT #1
    不需要点击,直接执行w()和h() 点击第三第四个按钮的时候出现undefined
    2018-08-10 23:51:23
问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
从网页搭建入门Java Web2018版
  • 参与学习           人
  • 提交作业       1088    份
  • 解答问题       10204    个

如果你有Java语言基础,又想以后从事Java Web开发,那么本路径是你的不二选择!本路径从网页搭建开始入手,通过大量案例来学习Java Web基础。定能助你完成Java Web小白的蜕变!

了解课程
请稍等 ...
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师