Question

我曾尝试使用window.onload调用该函数，但只有在我将其放置在body标签下时它才起作用，但是当我将它放在head标签中时（注释掉）它虽然功能得到但它不起作用叫（我已经发出警报并进行了检查。）

    <!DOCTYPE html5>
    <html>
    <head>
         <script>
             function onl()
             {          
                var x=document.forms[0].elements[0].name;
                document.write(x);
            }
            //window.onload = onl();
         </script>
    </head>
    <body>
        <form name=usern>
            <input type = "text" name ="username">
            <input type = "password" name ="password">
            <input type ="submit" name="sybmitb">
        </form>
        <script>
                 window.onload = onl();
        </script>
        <div id = "txt">
        </div>
    </body>
</html>

Answer 1

它不会在头部运行，因为赋值后使用的括号会导致函数立即运行。这意味着它会导致错误，因为文档尚未加载，因此导致表单元素未定义。

在头脑中，如果你改变了

window.onload = onl();

到

window.onload = onl;

然后它会起作用。

Answer 2

您必须将处理函数传递给document.load（或window.load），而不是函数的返回。因此，请使用document.onload = onl;代替document.onload = onl();（请参阅此处：https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onload）

所以结果：

<!DOCTYPE html5>
    <html>
    <head>
         <script>
             function onl()
             {          
                var x=document.forms[0].elements[0].name;
                document.write(x);
            }
            document.onload = onl;
         </script>
    </head>
    <body>
        <form name=usern>
            <input type = "text" name ="username">
            <input type = "password" name ="password">
            <input type ="submit" name="sybmitb">
        </form>
        <div id = "txt">
        </div>
    </body>
</html>

此致朱利安Q。

编辑：对不起，我之前误读了;）

Answer 3

当你分配这样的函数时，你需要确保不要调用它。当您将括号放在函数名称的末尾时，即使它被分配给窗口的加载事件，也会立即调用它。

因此，您只需将onl()替换为onl：

window.onload = onl;

至于为什么它在身体中起作用，因为当它到达身体的末端时，文件已经完成加载。

将onl()分配给窗口的onload属性并不是错误的，因为您要将onl()的返回值undefined分配给在window.onload。

此外，我建议不要使用window.onload，而是使用document.onload，因为{DOM}准备就绪时会触发document.onload，而不是在请求的文件准备好时。

为什么window.onload在javascript中在body中工作而不在head标签中？

3 个答案: