window.onload

最新推荐文章于 2023-04-03 09:23:19 发布

Lo-ra

最新推荐文章于 2023-04-03 09:23:19 发布

阅读量373

点赞数

本文链接：https://blog.csdn.net/yana_loo/article/details/51498428

版权

关于JavaScript程序读取HTML程序的节点，可以通过：

1、将代码移到网页元素之后

<section id="content"></section>
<script>
  var obj=document.getElementById("content");
</script>

2、将代码写入<body>的onLoad触发事件中

<script>
   function init(){
      var obj=document.getElementById("content");
}
</script>
<body onLoad="init()">
  <section id="content">hello</section>
</body>

3、将程序写入window.onload事件中

<script>
  window.οnlοad=function(){
    var obj = document.getElementById("content");
}
</script>
<section id="content">Hello</section>

两种方法可以使网页网页完整加载，避免因为js被少加载：

一、将脚本代码放在网页的低端，运行代码时候就能确保先加载完内容

二、通过window.onload来执行脚本

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title>test</title>
</head>
<style>
    #bgColor{ width:200px; height:50px; background-Color:#CCff33}
</style>
<script>
    document.getElementById("bgColor").style.backgroundColor="000000");
</script>
<body>
<section id="#bgColor"></section>
</body>
</html>

以上代码初衷是通过js改变section的颜色的，但现实并没次效果

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>test</title>
</head>
<style>
    #bgColor{ width:200px; height:50px; background-Color:#CCff33}
</style>
<script>
    window.οnlοad=function(){
        document.getElementById("bgColor").style.backgroundColor="#F90";
    }
</script>
<body>
<section id="bgColor"></section>
</body>
</html>

把window.load=function()加入后，section的颜色可以根据js的执行改变

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>test</title>
</head>
<style>
    #bgColor{ width:200px; height:50px; background-Color:#CCff33}
</style>
<script>
    function init() {
        var obj = document.getElementById("bgColor").style.backgroundColor = "#F90";
    }
</script>
<body οnlοad="init()">
<section id="bgColor"></section>
</body>
</html>

或者加入οnlοad="xx()"

**window.onload必须等到页面内容包括图片的所有u元素都加载完毕后才能执行

**window.onload不能同时编写多个，如果有多个window.onload方法，只会执行一个

Lo-ra

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
window.onload

关于JavaScript程序读取HTML程序的节点，可以通过：1、将代码移到网页元素之后 var obj=document.getElementById("content");2、将代码写入的onLoad触发事件中 function init(){ var obj=document.getElementById("content");} he
复制链接

扫一扫