js的延迟执行问题分析


Posted in Javascript onJune 23, 2014

看这段代码:

<body>
  <script src="deffer.js"></script>
  content
 </body>

deffer.js的内容为:

alert(1)

这样在alert窗口没有被关闭之前,页面都会是一片空白。因为alert窗口阻止了页面的继续渲染。

为了避免此类问题,html规范里定义了deffer和async属性,这两个属性的具体定义这里不讨论,反正他们都是用来告诉浏览器,一定要在页面渲染完成以后再执行本脚本的内容,这样脚本执行的时候页面已经渲染完毕了。

<body>
  <script deffer async src="deffer.js"></script>
  content
 </body>

注意,对于多个加了deffer或者async的脚本,他们的执行顺序和他们在页面上出现的顺序无关。即使html规范定义了deffer脚本应该按照顺序来执行,但是浏览器事实上并没有全部遵守这个约定。

Javascript 相关文章推荐
Array的push与unshift方法性能比较分析
Mar 05 Javascript
分享一个自己写的table表格排序js插件(高效简洁)
Oct 29 Javascript
JavaScript:new 一个函数和直接调用函数的区别分析
Jul 10 Javascript
Jquery自定义button按钮的几种方法
Jun 11 Javascript
jquery向上向下取整适合分页查询
Sep 06 Javascript
在 Angular2 中实现自定义校验指令(确认密码)的方法
Jan 23 Javascript
详解如何使用webpack打包Vue工程
May 27 Javascript
js实现图片轮播效果学习笔记
Jul 26 Javascript
LayUI表格批量删除方法
Aug 15 Javascript
超详细动手搭建一个VuePress 站点及开启PWA与自动部署的方法
Jan 27 Javascript
javascript关于“时间”的一次探索
Jul 24 Javascript
layui实现根据table数据判断按钮显示情况的方法
Sep 26 Javascript
JQEasy-ui在IE9以下版本中二次加载的问题分析及处理方法
Jun 23 #Javascript
教你用AngularJS框架一行JS代码实现控件验证效果
Jun 23 #Javascript
js自定义鼠标右键的实现原理及源码
Jun 23 #Javascript
js代码实现的加入收藏效果并兼容主流浏览器
Jun 23 #Javascript
用jquery的方法制作一个简单的导航栏
Jun 23 #Javascript
jquery的attr方法禁用表单元素禁用输入内容
Jun 23 #Javascript
JavaScript获取某年某月的最后一天附截图
Jun 23 #Javascript
You might like
采用memcache在web集群中实现session的同步会话
2014/07/05 PHP
浅谈htmlentities 、htmlspecialchars、addslashes的使用方法
2016/12/09 PHP
getElementsByTagName vs selectNodes效率 及兼容的selectNodes实现
2010/02/26 Javascript
Jquery实现无刷新DropDownList联动实现代码
2010/03/08 Javascript
jquery 学习之二 属性相关
2010/11/23 Javascript
jQuery.parseJSON(json)将JSON字符串转换成js对象
2014/07/27 Javascript
判断在css加载完毕后执行后续代码示例
2014/09/03 Javascript
SyntaxHighlighter 3.0.83使用笔记
2015/01/26 Javascript
在其他地方你学不到的jQuery小贴士和技巧(欢迎收藏)
2016/01/20 Javascript
jquery显示隐藏元素的实现代码
2016/05/19 Javascript
JavaScript必看小技巧(必看)
2016/06/07 Javascript
jQuery异步提交表单的两种方式
2016/09/13 Javascript
bootstrap paginator分页插件的两种使用方式实例详解
2017/11/14 Javascript
ndm:NPM的桌面GUI应用程序
2018/10/15 Javascript
Vue实现的父组件向子组件传值功能示例
2019/01/19 Javascript
前端js中的事件循环eventloop机制详解
2019/05/15 Javascript
微信小程序swiper使用网络图片不显示问题解决
2019/12/13 Javascript
如何实现iframe父子传参通信
2020/02/05 Javascript
VSCode插件安装完成后的配置(常用配置)
2020/08/24 Javascript
Python实现控制台进度条功能
2016/01/04 Python
基于python traceback实现异常的获取与处理
2019/12/13 Python
详解Python3 中的字符串格式化语法
2020/01/15 Python
win10安装tesserocr配置 Python使用tesserocr识别字母数字验证码
2020/01/16 Python
基于keras 模型、结构、权重保存的实现
2020/01/24 Python
一篇文章搞懂python的转义字符及用法
2020/09/03 Python
详解android与HTML混合开发总结
2018/06/06 HTML / CSS
美国性感内衣店:Yandy
2018/06/12 全球购物
美国室内和室外装饰花盆购物网站:ePlanters
2019/03/22 全球购物
如何写好升职自荐信
2014/01/06 职场文书
旅游项目开发策划书
2014/01/18 职场文书
收银员的岗位职责范本
2014/02/04 职场文书
竞选劳动委员演讲稿
2014/04/28 职场文书
优质服务演讲稿
2014/05/14 职场文书
三方股东合作协议书范本
2014/09/28 职场文书
让子弹飞观后感
2015/06/11 职场文书
2015国庆节宣传语
2015/07/14 职场文书