JS_高程2.在HTML中使用Javascript（2）
1.延迟脚本defer
在<script>元素中设置defer属性，相当于告诉浏览器立即下载，但是延迟执行。<script>中的脚本会延迟到浏览器遇到</html>标签后再执行。
注：
（1）html5规范要求脚本按照它们出现的先后顺序执行，因此第一个延迟脚本会先于第二个延迟脚本执行，而这两个脚本会先于DOMContentLoaded事件执行。
在现实当中，延迟脚本并不一定会按照顺序执行，也不一定会在DOMContentLoaded事件触发前执行，因此最好只包含一个延迟脚本。
（2）html5规定，defer属性只适用于外部脚本文件，因此html会忽略给嵌入脚本设置defer属性。
ie4~ie7还支持对嵌入脚本的defer属性，但是ie8开始则完全支持html5的规范。
（3）有些浏览器会忽略defer属性，像平常一样处理脚本，为此，把延迟脚本放在页面的底部仍然是最佳的选择。
2.异步脚本async
async属性可以不让页面等待脚本的下载和执行，从而异步加载页面的其他内容。为此，建议异步脚本不要在加载期间修改DOM。
注：
async只适用于外部脚本文件，并告诉浏览器立即下载文件。但是defer不同的是，标记问async的脚本并不按照指定它们的先后顺序执行。
异步脚本一定会在页面的load事件前执行，但可能会在DOMContentLoaded事件触发之前或之后执行。
3.在XHTML（Extensible HyperText Markup Language）中的用法比html严格很多。
eg：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Test</title>
<script type="text/javascript">
function compare(a,b){
if(a <b){
alert("A is less than B");
}
else if(a > b){
alert("A is greater than B");
}
else{
alert("A is equal to B");
}
}
</script>
</head>
<body>
<button type="button" onclick="compare(3,10)">Try it</button>
</body>
</html>
运行结果：
同样的代码在xhtml中是无效的，结果如下：
因为比较语句a < b中的小于号“<”号在xhtml中将被当做开始一个新标签来解析。但是作为标签来讲，小于号后面不能跟空格，因此导致语法错误。
P15~P17内容后续理解。
JS_高程2.在HTML中使用Javascript（2）的更多相关文章
- JS_高程2.在HTML中使用Javascript（1）
1.使用<script>元素向HTML页面中插入Javascript HTML4.01中<script>标签有6个属性: (1)async:可选.表示立即下载脚本,不影响页面中 ...
- JS高程2.在HTML中使用Javascript（1）
1.使用<script>元素向HTML页面中插入Javascript HTML4.01中<script>标签有6个属性: (1)async:可选.表示立即下载脚本,不影响页面中 ...
- JS高程2.在HTML中使用Javascript（2）
1.延迟脚本defer 在<script>元素中设置defer属性,相当于告诉浏览器立即下载,但是延迟执行.<script>中的脚本会延迟到浏览器遇到</html> ...
- JavaScript高级程序设计-(1)html中使用JavaScript
html中使用JavaScript 1.延迟脚本 script标签定义了defer属性,脚本会被延迟到整个页面都解析完毕后运行 详细内容如下: 2.异步脚本 script标签定义了async属性,as ...
- 在HTML中使用JavaScript元素
script属性<script async = async charset="utf-8" defer="defer" src="index.h ...
- 2在HTML中使用JavaScript
像HTML页面中插入JavaScrip的主要方法,就是使用<script>元素.HTML4.01为<script>定义了6个属性:async:可选,表示应该立即下载脚本,当不妨 ...
- javascript高级编程3第二章：在html中使用javascript
2.1 <script>元素 向html页面中插入javascript的主要方法,就是使用<script>元素.这个元素被加入到正式的html规范中.html4.01为< ...
- 在Swift中使用JavaScript的方法和技巧
本文作者Nate Cook是一位独立的Web及移动应用开发者,是继Mattt大神之后NSHipster的主要维护者,也是非常知名活跃的Swift博主,并且还是支持自动生成Swift在线文档的Swift ...
- js002-在HTML中使用JavaScript
js002-在HTML中使用JavaScript 2.1 <script>元素 定义了以下6个属性 async: 可选.表示应该立即下载脚本,但不妨碍页面中的 ...
随机推荐
- C#学习-面向对象语言都有类
面向对象语言的一个基本特征是它们都有类,类是C#(这类语言)中的一种复杂数据类型. 类代表一组具有公共属性和行为的对象. 在C#中定义一个类是非常简单的,只需使用class关键字并按格式来定义即可. ...
- Vs2017获取Git空仓库后创建解决方案及项目无法推送,推送失败的问题.
与Git无关,因为远程是空文件夹,导致没有远程版本做对应提示更改或怎样,必须在创建人创建仓库的时候上传文件代码. https://developercommunity.visualstudio.c ...
- CentOS7安装MySQL并设置远程登录
在CentOS中默认安装有MariaDB,这个是MySQL的分支,但为了需要,还是要在系统中安装MySQL,而且安装完成之后可以直接覆盖掉MariaDB. 1 下载并安装MySQL官方的 Yum Re ...
- nodeJS有多快
听说nodeJS适用于高并发的场景,一直想测试但是没找到机会 这几天新系统要上线了,老系统的数据需要割接到新的系统中 由于数据量很大,表的结构的发生了很大的改变,割接时间长达9个小时 其中一个模块有1 ...
- Python_面向对象_类1
面向对象:减少重复代码,提高效率,比函数式编程更高效 类的创建: 实例属性又称:成员变量,成员属性(或者字段) 面向对象的三大特性: 一.封装 把客观事物封装为抽象的类,并对外只暴露一个可用接口 使用 ...
- seafile+glusterfs 安装部署
今天在虚拟机上搭一下seafile,用于测试环境.此处安装的是社区免费版本的,可以使用一键自动安装(MySQL适用). 官方文档:https://manual-cn.seafile.com/ 1.一键 ...
- Linux LVM动态扩容
引用自: https://blog.csdn.net/u012439646/article/details/73380197 xfs_growfs /dev/centos/root 一.首先安 ...
- Codeforces 781D Axel and Marston in Bitland 矩阵 bitset
原文链接https://www.cnblogs.com/zhouzhendong/p/CF781D.html 题目传送门 - CF781D 题意 有一个 n 个点的图,有 m 条有向边,边有两种类型: ...
- maya cmds pymel polyEvaluate 获取 bounding box
maya cmds pymel polyEvaluate 获取 bounding box cmds.polyEvaluate(bc = 1) #模型 cmds.polyEvaluate(bc2 = ...
- Java集合—Set集和Map集
一.Set集合 1.概述 Set集合无序的.不可重复的元素(无序是指索引) Set集合不按照特定的方法进行排序,只是将元素放在集合中. 下面介绍一下Set集合的HashSet和TreeSet两个实现类 ...