javascript document.forms.length函数内部返回0,函数外部正常工作

ffscu2ro  于 2023-01-19  发布在  Java
关注(0)|答案(3)|浏览(101)

谁能给我解释一下为什么下面的代码在函数内部不起作用,但在函数外部却能完美地工作?

function calculate_document_forms_length(){
    document.forms.length;
}

从控制台运行它返回“undefined”,但是当我从控制台运行document.forms.length时,它本身返回页面上的表单数量。我试着理解为什么它不起作用,但是我找不到原因。它发生在firefox,也发生在chrome。我看不出为什么它不起作用。
编辑以澄清几件事。
它在页面加载完成后从控制台运行,下面的代码返回正确的值。

document.forms.length;

所以我不知道它为什么会这样。
好的,这里是测试HTML页面的确切源代码。

<html>
  <head>
    <title>test page 01</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <body>
    <form>
        <input type="text" name="test1" />
    </form>
    <form>
        <input type="text" name="tes2" />
    </form>
  </body>
</html>

正如你所看到的,没有框架,只有纯HTML和标签中的表单。

nwwlzxa7

nwwlzxa71#

这里的函数不返回任何东西(也就是说,当你运行它时,它“返回”undefined)。

function() {
    return document.forms.length;
}

同样,如果你在控制台中运行它,你仍然会得到undefined,因为你仍然没有调用这个函数,你只是创建了它,但是它仍然没有被执行。
如果要在控制台中运行它,可以编写

(function() {
    return document.forms.length;
}());

最后,如果你在控制台中写document.forms.length,控制台会显示它的值,因为length是一个变量,这就是为什么它看起来是有效的。

wgmfuz8q

wgmfuz8q2#

这没有回答为什么,但如果你返回它,它的工作:

function aa(){
    return document.forms.length;
}
cngwdvgl

cngwdvgl3#

问题是您的代码document.forms.length;在呈现整个页面之前运行。
要解决此问题:
1.将defer属性添加到脚本元素或
1.将script标签移向html的末尾,就在body结束标签的上方。

相关问题