javascript - 为什么此脚本无法运行？

Question

无论出于何种原因，从控制台运行时都会起作用：

var wh=window.innerHeight;
var h= wh-345;
$('.hidehome').attr('style', 'display:block;height:'+h+'px;width:100%');

但这不是：

$(document).ready(function() {
var wh=window.innerHeight;
var h= wh-345;
$('.hidehome').attr('style', 'display:block;height:'+h+'px;width:100%'); )};

我不知道为什么。控制台告诉我

Syntax error at line 4: expected expression, got ')'
h+'px;width:100%'); )};
--------------------^

这显然意味着我的代码有问题，但我仍然无法弄清楚。

Answer 1

你的括号和花括号需要互换：

$('.hidehome').attr('style', 'display:block;height:'+h+'px;width:100%'); )};
                                                                         ^^
                                                                     Right here

另外，考虑使用以下css方法：

$('.hidehome').css({
    'display': 'block',
    'height': h + 'px',
    'width': '100%'
});

Answer 2

代替

)};

这样 ：

});

您必须先关闭函数定义，然后再调用document.ready(...).

当你遇到这样的问题找不到时，试着用缩进扩展你的代码，问题就会很明显：

$(document).ready(
    function() {
        $('.hidehome').attr(
            'style',
            'display:block;height:'+h+'px;width:100%'
        );
    ) // <= doesn't match
}; // <= doesn't match

事实上，我通常更喜欢这种扩展和对称的形式。非对称支撑的代码让我很痛苦，因为乍一看结构不可读。