JavaScript异步加载方案
(1) defer,只支持IE
defer属性的定义和用法(我摘自w3school网站)
defer 属性规定是否对脚本执行进行延迟,直到页面加载为止。
有的 javascript 脚本 document.write 方法来创建当前的文档内容,其他脚本就不一定是了。
如果您的脚本不会改变文档的内容,可将 defer 属性加入到 <script> 标签中,以便加快处理文档的速度。因为浏览器知道它将能够安全地读取文档的剩余部分而不用执行脚本,它将推迟对脚本的解释,直到文档已经显示给用户为止。
alert(document.getElementById("p1").firstChild.nodeValue);
(2) async:
async的定义和用法(是HTML5的属性)
async 属性规定一旦脚本可用,则会异步执行。
<script type="text/javascript" src="demo_async.js" async="async"></script>
注释:async 属性仅适用于外部脚本(只有在使用 src 属性时)。
注释:有多种执行外部脚本的方法:
•如果 async="async":脚本相对于页面的其余部分异步地执行(当页面继续进行解析时,脚本将被执行)
•如果不使用 async 且 defer="defer":脚本将在页面完成解析时执行
•如果既不使用 async 也不使用 defer:在浏览器继续解析页面之前,立即读取并执行脚本
(3) 创建script,插入到DOM中,加载完毕后callBack,见代码:
<script type="text/javascript">
function loadScript(url, callback) {
var script = document.createElement_x("script")
script.type = "text/javascript";
if (script.readyState) { //IE
script.onreadystatechange = function() {
if (script.readyState == "loaded" ||
script.readyState == "complete") {
script.onreadystatechange = null;
callback();
}
};
} else { //Others: Firefox, Safari, Chrome, and Opera
script.onload = function() {
callback();
};
}
script.src = url;
document.body.appendChild(script);
}
</script>
JavaScript异步加载方案的更多相关文章
- Javascript 异步加载详解
Javascript 异步加载详解 本文总结一下浏览器在 javascript 的加载方式. 关键词:异步加载(async loading),延迟加载(lazy loading),延迟执行(lazy ...
- Javascript 异步加载详解(转)
本文总结一下浏览器在 javascript 的加载方式. 关键词:异步加载(async loading),延迟加载(lazy loading),延迟执行(lazy execution),async 属 ...
- 不得不说的JavaScript异步加载
同步加载的问题 默认的js是同步加载的,这里的“加载”可以理解成是解析.执行,而不是“下载”,在最新版本的浏览器中,浏览器对于代码请求的资源都是瀑布式的加载,而不是阻塞式的,但是js的执行总是阻塞的. ...
- javascript异步加载的三种解决方案
默认情况javascript是同步加载的,也就是javascript的加载时阻塞的,后面的元素要等待javascript加载完毕后才能进行再加载,对于一些意义不是很大的javascript,如果放在页 ...
- 关于JS异步加载方案
javascript延迟加载的解决方案: 1.使用defer标签 <span style="font-size: small;"><script type=&qu ...
- javascript异步加载详解(转)
本文总结一下浏览器在 javascript 的加载方式. 关键词:异步加载(async loading),延迟加载(lazy loading),延迟执行(lazy execution),async 属 ...
- JavaScript异步加载的三种方式——async和defer、动态创建script
一.script标签的位置 传统的做法是:所有script元素都放在head元素中,必须等到全部js代码都被下载.解析.执行完毕后,才能开始呈现网页的内容(浏览器在遇到<body>标签时才 ...
- Python+Selenium+PhantomJS下载JavaScript异步加载网页
# -*- coding: utf-8 -*- from selenium import webdriver import selenium.webdriver.support.ui as ui fr ...
- windows phone 8.0 的网络图片异步加载方案
买了一本林政的8.1UI的书,看到一个使用弱引用对像来解决图片缓存的问题,刚好自已写的应用也遇到这个问题,于是小改动了一下代码,搬到了8.0版本来使用,代码由 zhxilin℃+ 大神提供了部分解决代 ...
随机推荐
- git学习(1)
一.git fetch 和git pull 的差别 1.git fetch 相当于是从远程获取最新到本地,不会自动merge,如下指令: git fetch orgin master //将远程仓库的 ...
- hbase + phoenix 单机版安装
1. 环境: centos 6.5 jdk 1.8.0 http://www.oracle.com/te ...
- 举枪消灭"烂代码"的实战案例
前言 之前我写过一篇如何少写PHP "烂"代码 https://segmentfault.com/a/11...感觉很多新人对此不太理解.今天以打卡功能为例,去讲解其中的奥秘.那篇 ...
- hdu2009 求数列的和【C++】
求数列的和 Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others)Total Submi ...
- MongoDB整库备份与还原以及单个collection备份、恢复
备份前的检查> show dbsMyDB 0.0625GBadmin (empty)bruce 0.0625GBlocal (empty)test 0.0625GB> use MyDBsw ...
- 清北学堂模拟赛d2t6 分糖果(candy)
题目描述总共有n颗糖果,有3个小朋友分别叫做L,Y,K.每个小朋友想拿到至少k颗糖果,但这三个小朋友有一个共同的特点:对3反感.也就是说,如果某个小朋友拿到3颗,13颗,31颗,333颗这样数量的糖果 ...
- Segmentation fault到底是何方妖孽
http://blog.chinaunix.net/uid-23069658-id-3959636.html?page=2 进程运行的时候,它虚拟地址空间的布局和它所占用的物理内存到底是什么样子呢?虚 ...
- [luogu2209][USACO13]燃油经济性Fuel Economy_贪心
燃油经济性Fuel Economy 题目大意:FJ想要去旅行.他的车总容量为G,每行驶一个单位就消耗一个单位的油.FJ要行驶D个单位的距离.期间存在n个加油站,每个加油站有一个价格,表示在这个燃油站买 ...
- CF #328div2 D
这题不难,当时想出来了,可是却写不出来~~ 现在慢慢写回来,也写得好挫~ 可以知道,被攻击的城市必定可以组成一棵树,然后,传送到的点必定也是城市之一.如果出发后回到原点,则需要2E,E是树的边数,则2 ...
- Android开发趣事记之周期性广告
前些天做了一个应用,由于怕影响用户体验,所以我将广告设定了一下,就是每启动软件8次.就会弹出一次广告. 在上传到应用宝后.竟然得到了这种结果: 看到了吧.无病毒,无广告. 看来审核人员是不会把应用连续 ...