onload事件
onload事件:页面加载(文本和图片)完毕的时候,
onload的作用:
- 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> 整个页面上所有元素加载完毕后再执行js的内容
window.onload可以预防使用标签在定义之前,即实现JS代码于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事件的更多相关文章
- JavaScript 中 onload 事件绑定多个方法
当需要调用的方法较多时,我们可以进一步优化,编写一个专门用于绑定 onload事件的方法: function addLoadEvent(func) { //把现有的 window.onload 事件处 ...
- jQuery $(document).ready()和JavaScript onload事件
jQuery $(document).ready()和JavaScript onload事件 Why we need a right time? 对元素的操作和事件的绑定需要等待一个合适的时机,可以看 ...
- onload事件-----addLoadEvent函数
在给网页加一些特效时经常要在<body>中加入“onload”事件,即在网页加载完后执行某事件,例如:<body onload=”alert(‘欢迎光临!')”,但这样做有个大的缺陷 ...
- 共享onload事件
在做前端工作中,我们想要设置某个函数prepare,让它在网页加载完毕后执行,会触发一个onload事件,这个事件与windows对象相关联,必须把prepare函数绑定到这个时间上,语法如下:win ...
- javascript中onload事件如何绑定及执行顺序
onload事件,顾名思义就是为了js程序能够在网页加载成功过后进行执行.对于放在head里面的js来说,非常必要. 如何给网页绑定onload,主要有三种方式: window.onload=func ...
- jQuery的document ready与 onload事件——你真的思考过吗?
在进行实验和资料查询时,我遇到了几个关键问题: 1. window.onload到底是什么加载完触发? 2. body为什么会有onload事件? 3. 为什么是window.onload,而不是do ...
- 【HTML】Iframe中的onload事件
当iframe.src重新指定一个url时会重新执行iframe的onload事件 <iframe id="indexFrame" name="index" ...
- 学习JQuery的$.Ready()与OnLoad事件比较
$(document).Ready()方法 VS OnLoad事件 VS $(window).load()方法接触JQuery一般最先学到的是何时启动事件.在曾经很长一段时间里,在页面载入后引发的事件 ...
- $(document).Ready()方法 VS OnLoad事件 VS $(window).load()方法
$(document).Ready()方法 VS OnLoad事件 VS $(window).load()方法接触JQuery一般最先学到的是何时启动事件.在曾经很长一段时间里,在页面载入后引发的事件 ...
- (js有关图片加载问题)dom加载完和onload事件
引用旺旺的话...哈哈哈DOMContentLoaded事件表示页面的DOM结构绘制完成了,这时候外部资源(带src属性的)还没有加载完.而onload事件是等外部资源都加载完了就触发的.$.read ...
随机推荐
- CSS3 white-space属性
white-space 属性设置如何处理元素内的空白. 可能的值 值 描述 normal 默认.空白会被浏览器忽略. pre 空白会被浏览器保留.其行为方式类似 HTML 中的 <pre> ...
- List Set Map的区别
1.读取频繁选用List 快速访问选取ArrayList,经常进行添加删除工作可以选用LinkList 2.如果你想进行有序的插入那么还是选型List,因为List是一个有序的容器 3.如果你想保证插 ...
- react组件回顶部
在挂载更新里面判断滚动条的距离(滚动条不能overflow: auto 踩坑) componentDidMount(){ window.addEventListener('scroll' , ()=& ...
- vue 高阶 provide/inject
1.一般情况使用都是在app.vue配置为: provide () {return {isTest: this}}, 2.所有子组件都可以引用 拿到app.vue里面的所有数据 inject: ['i ...
- 如何访问dashed filename
第一关:boJ9jbbUNNfktd78OOpsqOltutMc3MY1 第二关:CV1DtqXWVFXTvM2F0k09SHz0YwRINYA9 cat <- 第三关:如何访问spaces i ...
- Swift 反射机制,命名空间
1. 知道 Swift 中有命名空间 - 在同一命名空间下,全局共享! - 第三方框架使用 Swift 如果直接拖拽到项目中,从属同一个命名空间,很有可能冲突! ...
- osg探究补充:Node::accept(NodeVisitor& nv)及NodeVisitor简介
前言 在前几节中,我自己觉得讲的比较粗糙,因为实在是时间上不是很充足,今天我想弥补一下,希望不是亡羊补牢.我们在osgViewer::Viewer::eventTraversal()函数中经常看到这么 ...
- git基本
基本的git操作 git config --global user.name "你的名字或昵称" git config --global user.email "你的邮箱 ...
- 《C#从现象到本质》读书笔记(七)第9章 泛型
<C#从现象到本质>读书笔记(七)第9章 泛型 泛型的三大好处:类型安全,增强性能(避免装箱和拆箱),代码复用. 泛型方法是传入的参数至少有一个类型为T(尚未制定的类型,根据微软的命名规则 ...
- Mac 电脑设置显示路径
# 设置 defaults write com.apple.finder _FXShowPosixPathInTitle -bool TRUE;killall Finder # 删除 defaults ...