                        课程
                    
                        /前端开发
                        
                            /JavaScript
                        
                        /JavaScript进阶篇

@WingMeng的问题“想增加一个功能：窗口改变时重新获取窗口大小”引申出来的疑惑。

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>
<script type="text/javascript">
function Size(){
    var Wt = document.documentElement.clientWidth || document.body.clientWeight;
    var Ht = document.documentElement.clientHeight || document.body.clientHeight;
    document.innerHTML="浏览器当前窗口大小为：" + Wt +"px&times;" + Ht + "px";
}
Size(); 
// 当前窗口调整尺寸时重新获取尺寸
window.onresize = function(){
    Size();
}
</script>
</body>
</html>

我有一个知识点不太懂，15行的代码

window.onresize = function(){
    Size();
}

为什么要加上function(){} ？

Size()不已经是一个函数了吗？

试了一下去掉function()后Size()只能运行一次，请问这是为什么？

具体的知识点在哪里讲过还请大神明示，我好具体的看看。THX~

Groune

2015-04-11

源自：JavaScript进阶篇 9-18

关注问题我要回答

1072

操作

收起

2 回答

Groune 提问者
2015-07-12

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript">

// 当前窗口调整尺寸时重新获取尺寸
window.onresize = Size;

function Size()
{
    var Wt = document.documentElement.clientWidth || document.body.clientWeight;
    var Ht = document.documentElement.clientHeight || document.body.clientHeight;
    document.body.innerHTML = "浏览器当前窗口大小为：" + Wt +"px&times;" + Ht + "px";
}

</script>
</head>
<body>
</body>
</html>

一下详细解答来自百度知道->@司马唐迁。

js是事件驱动的，一个节点可以发生很多种事件，包括click事件。在js中，当节点发生某一个事件时，可以为该事件绑定一个处理函数。也就是类似的

document.getElementById("myBtn").onclick = function(){}

所要注意的是，这个节点的onclick属性，需要赋给一个函数类型的值，才可以处理事件。

但是displayDate()并不是一个函数，你可以说你定义了displayDate函数，但displayDate()也就是加了一对括号的displayDate，是函数执行了，displayDate()是等价于displayDate的返回值的。在displayDate函数里，只是给id为demo的节点重新设置了内容，没有返回值，所以默认的就是undefined。

那么如果写成

document.getElementById("myBtn").onclick = displayDate();

实际上是等价于

document.getElementById("myBtn").onclick = undefined;

显然undefined是不能作为节点事件的处理函数的。

但是，也不是一定要加上function(){}，你可以写成这样：

document.getElementById("myBtn").onclick = displayDate;

虽然displayDate()不是函数，但displayDate却是函数，是可以作为节点事件的处理函数的。

1 回复有任何疑惑可以回复我~

收起回答

犀利一下下

讲的很好，谢谢

2015-08-09 回复有任何疑惑可以回复我~

Danmomo
2015-07-09

function Size(){
    var Wt = document.documentElement.clientWidth || document.body.clientWeight;
    var Ht = document.documentElement.clientHeight || document.body.clientHeight;
    document.innerHTML="浏览器当前窗口大小为：" + Wt +"px&times;" + Ht + "px";
}
Size();

这里执行了一次Size();所以如果是这样的话

window.onresize = Size();

无论窗口改不改变，Size()的值都直接赋值给window.onresize

因此要这样

window.onresize = function(){
    Size();
}

当窗口发生改变的时候，才再一次执行Size();让改变后的窗口值赋给window.onresize();

我的理解就是这样，不对别喷，大家来探讨

0 回复有任何疑惑可以回复我~

收起回答

0/150

提交

取消

JavaScript进阶篇

参与学习 468061 人
解答问题 21891 个

本课程从如何插入JS代码开始，带您进入网页动态交互世界

进入课程

本课相似问答

2 回答想增加一个功能：窗口改变时重新获取窗口大小

3 回答新开窗口的大小不会改变？

2 回答window.open() 窗口大小的值

1 回答打开新窗口，怎么让固定大小的窗口居中呢

1 回答怎么在新窗口调用父窗口

搜索更多本课相关问答

@WingMeng的问题“想增加一个功能：窗口改变时重新获取窗口大小”引申出来的疑惑。

我要回答关注问题

热搜

最近搜索清空

@WingMeng的问题“想增加一个功能：窗口改变时重新获取窗口大小”引申出来的疑惑。

2 回答

本课相似问答

@WingMeng的问题“想增加一个功能：窗口改变时重新获取窗口大小”引申出来的疑惑。