Question

所以我知道如果你使用jQuery，你可以使用$(document).load(function(){});，这样你写入函数的任何代码都会在整个页面加载后执行，但如果你不这样做，有办法做类似的事情。使用jQuery并只使用JS？

例如......

<html>
    <head>
        <script type="text/javascript">
            var box = document.getElementById('box');
            alert(box);
        </script>
    </head>
    <body>
        <div id="box" style="width:200px; height:200px; background-color:#999; 
margin:20px;"></div>
    </body>
</html>

如果我使用此方法，警报只会显示null。那么有一种方法可以在页面加载后运行js代码吗？

Answer 1

我用：

<script type="text/javascript">
    window.onload = function(){
        //do stuff here
    };
</script>

这样您就不必在html中使用任何onload标记。

Answer 2

最简单的方法是简单地将脚本放在文档的末尾，通常就在关闭正文标记之前：

<html>
<head>

</head>
<body>
<div id="box" style="width:200px; height:200px; background-color:#999; margin:20px;"></div>
<script type="text/javascript">
    var box = document.getElementById('box');
    alert(box);
</script>
</body>

</html>

Answer 3

您可以使用多种方法来完成此任务。

最简单，最简单的方法是在body标签的末尾添加脚本标记：

<html>
<head>
    <title> Example </title>
</head>
<body>
    <div>
        <p>Hello</p>
    </div>
    <script type="text/javascript">
        // Do stuff here
    </script>
</body>
</html>

jQuery的做法类似于：

window.onload = function() {
    // Do stuff here
}

我通常只是第二种方式，以防万一。

为确保跨浏览器兼容性，请浏览jQuery源并找到他们使用的内容。

Answer 4

您可以在身体标签中使用onload。

<head>
   <script type="text/javascript">
      function doSomething() {
         //your code here
      }
   </script>
</head>
<body onload="doSomething()">

在页面加载时执行JS而不使用jQuery

4 个答案: