onload事件：页面加载（文本和图片）完毕的时候，

onload的作用：

  1. JS加载时和html是同步加载的，如果使用元素在定义元素之前易报错；

    <!DOCTYPE html>
    
<html lang="en">
    
    <head>
    
        <meta charset="UTF-8">
    
        <title>Document</title>
    
        <script>
    
            var btn=document.getElementById("btn");
    
            btn.onclick=function(){
    
                alert("Hello JavaScript!");
    
            };

        </script>
    
    </head>
    
    <body>
    
        <button id="btn">点击</button>
    
    </body>
    
</html>

  2. 整个页面上所有元素加载完毕后再执行js的内容

window.onload可以预防使用标签在定义之前，即实现ＪＳ代码于html页面的异步加载

<!DOCTYPE html>

<html lang="en">

    <head>

        <meta charset="UTF-8">

        <title>Document</title>

        <script>

            window.onload=function(){

                var btn=document.getElementById("btn");

                btn.onclick=function(){

                    alert("Hello Javascript!");

                }

            }

        </script>

    </head>

    <body>

        <button id="btn">点击</button>

    </body>

</html>

同步与异步：

1.生活中同步是所有的事一起执行，异步是事件一件一件的执行

2.web中同步是事件一件一件的执行，异步是所有的事一起执行

onload事件的更多相关文章

  1. JavaScript 中 onload 事件绑定多个方法

    当需要调用的方法较多时,我们可以进一步优化,编写一个专门用于绑定 onload事件的方法: function addLoadEvent(func) { //把现有的 window.onload 事件处 ...

  2. jQuery $(document).ready()和JavaScript onload事件

    jQuery $(document).ready()和JavaScript onload事件 Why we need a right time? 对元素的操作和事件的绑定需要等待一个合适的时机,可以看 ...

  3. onload事件-----addLoadEvent函数

    在给网页加一些特效时经常要在<body>中加入“onload”事件,即在网页加载完后执行某事件,例如:<body onload=”alert(‘欢迎光临!')”,但这样做有个大的缺陷 ...

  4. 共享onload事件

    在做前端工作中,我们想要设置某个函数prepare,让它在网页加载完毕后执行,会触发一个onload事件,这个事件与windows对象相关联,必须把prepare函数绑定到这个时间上,语法如下:win ...

  5. javascript中onload事件如何绑定及执行顺序

    onload事件,顾名思义就是为了js程序能够在网页加载成功过后进行执行.对于放在head里面的js来说,非常必要. 如何给网页绑定onload,主要有三种方式: window.onload=func ...

  6. jQuery的document ready与 onload事件——你真的思考过吗？

    在进行实验和资料查询时,我遇到了几个关键问题: 1. window.onload到底是什么加载完触发? 2. body为什么会有onload事件? 3. 为什么是window.onload,而不是do ...

  7. 【HTML】Iframe中的onload事件

    当iframe.src重新指定一个url时会重新执行iframe的onload事件 <iframe id="indexFrame" name="index" ...

  8. 学习JQuery的$.Ready()与OnLoad事件比较

    $(document).Ready()方法 VS OnLoad事件 VS $(window).load()方法接触JQuery一般最先学到的是何时启动事件.在曾经很长一段时间里,在页面载入后引发的事件 ...

  9. $(document).Ready()方法 VS OnLoad事件 VS $(window).load()方法

    $(document).Ready()方法 VS OnLoad事件 VS $(window).load()方法接触JQuery一般最先学到的是何时启动事件.在曾经很长一段时间里,在页面载入后引发的事件 ...

  10. （js有关图片加载问题）dom加载完和onload事件

    引用旺旺的话...哈哈哈DOMContentLoaded事件表示页面的DOM结构绘制完成了,这时候外部资源(带src属性的)还没有加载完.而onload事件是等外部资源都加载完了就触发的.$.read ...

随机推荐

  1. python虚拟环境的搭建

    使用python虚拟环境作用是项目与项目之间相互隔离,互相不受影响,比如当需要同时部署A.B两个项目时,A项目依赖C库的1.0版本,B项目依赖C库的2.0版本,假如不使用虚拟环境隔离A项目和B项目就很 ...

  2. oracle数据库分页总结

    /* BEGIN CREATE TABLE APPUSER(IDS NUMBER(8), USERNAME VARCHAR2(20), PASSWORD VARCHAR2(20), CTIME DAT ...

  3. [Java核心技术]第四章-对象与类(4.1-4.6总结)

    4.1面向对象程序设计概述 OOP(面向对象编程Object Oriented Programming) OOP中数据第一位,算法第二位. 类 封装:关键在于不能让其他方法直接访问类的实例域,程序仅通 ...

  4. 22. Generate Parentheses产生所有匹配括号的方案

    ［抄题］: Given n pairs of parentheses, write a function to generate all combinations of well-formed par ...

  5. Ubuntu 18.04学习笔记

    命令行快捷键 https://blog.csdn.net/wanlhr/article/details/80926804 Ubuntu18.04使用vi命令修改文件并保存 vi /opt/teamvi ...

  6. Android后台监控指定app的输入内容，抢红包，模拟点击原理

    Android开启辅助功能之后可以用AccessibilityService 去后台监控指定的app的输入内容,也可以监控到app的动作 以及通知栏的动作, 抢红包其实就根据通知栏出现了红包的通知消息 ...

  7. 杨其菊201771010134《面向对象程序设计（java)》第一周学习总结

    第一部分:课程准备部分 填写课程学习 平台注册账号, 平台名称 注册账号 博客园:www.cnblogs.com 安迪儿 程序设计评测:https://pintia.cn/ 迷路的麋鹿回不来家了 代码 ...

  8. 【java】:Junit

    创建单元测试文件 点击创建测试文件的目录,比如,我要在control目录下添加一个测试类,点击control文件夹 右键->new->other->junit test case 下 ...

  9. [Machine Learning][The Analytics Edge][Predicting Earnings from Census Data]

    census = read.csv("census.csv")library(caTools)set.seed(2000)spl = sample.split(census$ove ...

  10. @Scheduler与cron