JS权威指南学习笔记-浏览器中的JS

多个页面共享JS文件,实际上只会下载一次,其他的页面会从浏览器缓存中获取。

脚本的执行默认是同步和阻塞的,当HTML解析器遇到script 标签时,必须先加载、执行完脚本后才会继续文档的解析和渲染。

defer

脚本的执行会阻塞页面的渲染,因此,在简单的开发中可以将脚本放到文档结束的位置,来避免空白的出现。然而defer属性为我们提供了另一种解决办法,它的意思是延迟脚本的执行,即便把脚本放在head 部分,也会在文档解析渲染完成后再执行。
设置defer属性的脚本会按照在文档中出现的顺序依次执行。

async

这是html5中新增的属性,意思是异步地加载执行脚本,加载脚本的时候继续进行页面的解析和渲染,一旦脚本加载完成后就立即执行脚本。
所以可能不是按照顺序来执行的,如果存在依赖可能会出错。
如果async和defer属性同时使用,会忽略defer,使用async。

此外,脚本的异步加载和执行还可以通过动态生成<script> 节点来实现。

参考:script的defer和async

onerror

不是事件,是window对象的一个属性,如果该属性是一个方法, 那么在发生未捕获异常的时候会调用该函数。

JS加载执行的流程(时间线)

详见《JS权威指南》第13.3.4节,《客户端JavaScript时间线》。
简单来说,JS的执行分为同步加载执行和异步事件驱动两个阶段。
当所有节点都生成了,会触发document对象上的DomContentLoaded事件,此时JS从同步脚本执行阶段进入到异步事件驱动阶段;
当所有资源,如图片、异步脚本载入执行完毕,会触发window对象的load事件,document.readyState变成complete .

条件注释

IE浏览器支持条件注释:

<!--[if lte IE 8]> //低于或等于IE8
     do something
<[end if]-->

通过这种方式来解决IE的兼容问题。

同源策略

JS脚本只能和其所属文档来源相同的窗口和文档进行交互。
这里的来源是指:协议、服务器主机、端口号。
需注意:脚本的来源不重要,是它所嵌入的页面需要同源。

通过Ajax发出的Http请求也只能是向和所属页面同源的服务器发出。

跨域问题:

document.domain

该属性用来重置页面的域,默认是服务器主机名, 如果一个站点有多个子域名,例如food.example.com、hobby.example.com….那么受同源策略的限制,不能进行互相访问,如果将页面的document.domain

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值