window.onload 、body.onload 以及 jQuery 等dom加载完成后执行脚本的区别
1.关于window.onload 和 body.onload 的区别
当我们将onload 事件写在body元素上时,真正执行的其实是window对象的onload事件。因素HTMl页面中没有window标题,所以就写在body元素上了。
The onload attribute of the body object sets an onload event handler for the window. This technique of calling the window onload event through the bodyobject is overridden by any other means of invoking the window onload event, provided the handlers are in the same script language.
摘录自:http://technet.microsoft.com/zh-cn/subscriptions/index/cc197055(v%3Dvs.85).aspx
相关阅读:
defer,一个设计时可用的属性:
在解决以下的问题,当然后可以在body元素的onload事件中写代码,当对于script来说,还可以为脚本添加一个名为defer的属性,使JavaScript脚本在“整个页面加载完成”后才执行。像上面的代码,如果写成以下的样子,则会被正确的执行。
<html>
<head>
<script type="text/javascript" defer="true">
var obj = document.getElementById("div1");
obj.innerText = "This is my test defer attribute";
</script>
</head>
<body>
<div id="div1"></div>
</body>
</html>
对于这个属性,微软有以下解释:
Using the attribute at design time can improve the download performance of a page because the browser does not need to parse and execute the script and can continue downloading and parsing the page instead.
所以这个说这个属性真正使用的地方并不会多。不过这有助于我们理解HTMl页面是如何加载到浏览器的。
原文地址:http://hi.baidu.com/arjsyy/item/94894ca86c34c49b1410732e
可能你也碰到过这种情况,就是在js的代码中用了window.onload后,可能会影响到body中的onload事件。你可以全写在body 中,也可以全放到window.onload中,但是这样并不是很方便,有时我们需要两个同时用到。这时就要用window.attachEvent和 window.addEventListener来解决一下。
下面是一个解决方法。至于attachEvent和addEventListener的用法,可以自己Google或百度一下。
if (document.all)
{
window.attachEvent('onload',函数名)//IE中
}
else
{
window.addEventListener('load',函数名,false);//firefox
}
原文地址:http://blog.sina.com.cn/s/blog_4be585ca01000akh.html
推荐一篇博客:http://blog.csdn.net/john2522/article/details/7885453
window.onload 、body.onload 以及 jQuery 等dom加载完成后执行脚本的区别的更多相关文章
- jquery在页面加载完成后再append的元素事件无效问题
最近遇到一个问题,jquery在页面加载完成后再append的元素,append元素上有onclick事件,但是在append的元素上怎么点击都不会触发onclick事件.就如: <ul cla ...
- window.onload在文档加载完成后执行
验证a .b两点疑惑: a.<script src="./main.js"></script>中的window.onload是在html全部加载完了才执行, ...
- jQuery实现DOM加载方法源码分析
传统的判断dom加载的方法 使用 dom0级 onload事件来进行触发所有浏览器都支持在最初是很流行的写法 我们都熟悉这种写法: window.onload=function(){ ... } 但 ...
- JQuery 页面加载完成后执行事件
一: $(document).ready(function(){ //code }) 二: jQuery(document).ready(function(){ //code }) 三: window ...
- jquery mobile动态加载数据后无法渲染
引自:http://blog.sina.com.cn/s/blog_025270e901016lst.html jquery mobile在动态添加html之后无法渲染控件,无法转换控件的办法! jq ...
- 控制dom 加载成功后事件
- js实现类型jq的dom加载完成
有时候我们只想在 dom 加载完成后运行 js ,而不是等所有图片加载完成.所以不需要 onload , onload 会加载图片等其他媒体.很消耗时间. 原:http://blog.csdn.net ...
- DOM加载过程中ready和load的区别
在浏览器地址栏输入URL地址,浏览器开始加载页面时,有以下几个过程 1.浏览器开始解析HTML文档 2. 浏览器遇到HTML文档中的<script>元素以及CSS样式文件,并且没有asyn ...
- JQuery 之 在数据加载完成后才自动执行函数
数据加载完成执行: $(window).load(function(){ ... }); 进入页就执行,不论等数据是否加载完成: $(document).ready(function(){ ... } ...
随机推荐
- 构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统
http://www.tuicool.com/articles/NfyqQr 本节主要知识点是easyui 的手风琴加树结构做菜单导航 有园友抱怨原来菜单非常难看,但是基于原有树形无限级别的设计,没有 ...
- [UML] 如何找参与者、找用例
如何找参与者 1.谁会来使用这个系统? 2.谁会来安装这个系统? 3.谁会来启动这个系统? 4.谁会来维护这个系统? 5.谁会来关闭这个系统? 6.哪些系统会来使用这个系统? 7.谁会从这个系统获取信 ...
- NOIP 2015 跳石头
题目背景 一年一度的“跳石头”比赛又要开始了! 题目描述 这项比赛将在一条笔直的河道中进行,河道中分布着一些巨大岩石.组委会已经选择好了两块岩石作为比赛起点和终点.在起点和终点之间,有 N 块岩石(不 ...
- POJ 3260 The Fewest Coins(背包问题)
[题目链接] http://poj.org/problem?id=3260 [题目大意] 给出你拥有的货币种类和每种的数量,商店拥有的货币数量是无限的, 问你买一个价值为m的物品,最少的货币流通数量为 ...
- [BZOJ3684]大朋友和多叉树
设答案为$f_s$,它的生成函数为$\begin{align*}F(x)=\sum\limits_{i=0}^\infty f_ix^i\end{align*}$,则我们有$\begin{align* ...
- 【DFS序】【线段树】bzoj4034 [HAOI2015]T2
分开维护树的入栈序和出栈序,用两棵线段树.回答时就是用一颗的减去另一棵的. #include<cstdio> #include<algorithm> using namespa ...
- 软件配置篇-java下载及安装
1.进入java官网下载合适版本: 下载地址:https://www.oracle.com/technetwork/java/javase/downloads/index-jsp-138363.htm ...
- 求小于10000的素数的个数 Exercise06_10
/** * @author 冰樱梦 * 时间:2018年下半年 * 题目:求小于10000的素数的个数 * */ public class Exercise06_10 { public static ...
- gzip压缩目录
很遗憾,gzip不能针对整个目录进行压缩,只能递归压缩目录下的每一个文件. 当然,替代方案是只用tar进行打包,比如 tar cfz dir.tar.gz dirname
- Vue 单页应用:记事本
若文章中存在内容无法加载的情况,请移步作者其他博客. 简书 CSDN 最近在看 Vue 的时候,别人给我安利了一个国外的小案例,通过 Vue 和 Vuex 来实现一个记事本. 仔细剖析下,发现“麻雀虽 ...