《javascript高级程序设计(第3版)》-1
javascript有下列三个不同的部分组成:
- ECMAScript,由ECMA-262定义,提供核心语言功能
- 文档对象模型(DOM),提供访问和操作网页内容的方法和接口
- 浏览器对象模型(BOM),提供与浏览器交互的方法和接口
<script>定义了下列6个属性
- async: 可选。表示应该立即下载脚本,但不应妨碍页面中的其他操作,比如下载其他资源或等待加载其他脚本。只对外部脚本文件有效
- charset:可选。表示通过src属性指定的代码的字符集。由于大多数浏览器会忽略它的值,因此这个属性很少有人用。
- defer:可选。表示脚本可以延迟到文档完全被解析和显示之后再执行。只对外部脚本文件有效。IE7及更早版本对潜入脚本也支持这个属性。
- language:已废弃。原来用于表示编写代码使用的脚本语言(如JavaScript、JavaScript1.2或VBScirpt)。大多数浏览器会忽略这个属性,因此也没有必要在用。
- src:可选。表示包含要执行代码的外部文件。
- type:可选。可以看成是language的替代属性;表示编写代码使用脚本语言的内容类型(也称为MIME类型)。
text/javascript和text/ecmascript都已经不被推荐使用,但习惯用的还是text/javascript。实际上服务器在传送JavaScript时使用的MIME类型通常是application/x-javascript,但在type中设置这个值却可能导致脚本被忽略。在非IE浏览器还可以使用以下值:application/javascript和application/ecmascript。目前type值依旧还是text/javascript,如果没有指定,默认值仍为text/javascript。
<script>标签的位置
按照管理,所有<script>元素都应该放在页面的元素中,这样的目的是把所有外部文件(包含css,js)的引用都放在相同的地方。可是,在文档的元素中包含所有JavaScript文件,意味着必须等到全部JavaScript代码都被下载、解析和执行完成后,才能开始呈现页面的内容(浏览器在遇到标签时才开始呈现内容)。对于那些大型网站,有很多JavaScript代码的页面,这无疑会导致浏览器呈现页面时出现明显的延迟,而延迟期间的浏览器窗口中将是一片空白。为了避免这个问题,现在一般将JavaScript引用放在元素中,放在页面内容后面,这样用户会因为浏览器窗口显示空白页面的时间缩短而感到打开页面的速度加快了。
引用外部文件的好处
- 可维护性:把所有的JavaScript文件都放在一个文件夹中,维护起来轻松许多。而且开发人员也能够在不触及HTML标记的情况下,集中精力编辑JavaScript代码。
- 可缓存:浏览器能够根据具体的设置缓存链接的所有外部JavaScript文件。也就是说,如果有两个页面都是用同一个文件,那么这个文件只需下载一次。因此可以加快页面加载的速度。
- 适应未来:通过外部文件包含JavaScript无须使用XHTML或注释hack。HTML和XHTML包含外部文件的语法是相同的。
文档模式
- 最初的两种文档模式是:混杂模式(quirks mode)和标准模式(standards mode)。混杂模式会让IE的行为与(包含非标准特性的)IE5相同,而标准模式则让IE的行为更接近标准行为。虽然这两种模式主要影响CSS内容的呈现,但在某些情况下也会影响到JavaScript的解释执行。如果在文档开始处没有发现文档类型声明,则所有浏览器都会默认开启混杂模式。
- IE提出一种所谓的准标准模式(almost standards mode)。这种模式下的浏览器特性有很多是符合标准的,但也不尽然。不标准的地方主要表现在处理图片间隙的时候(在表格中使用图片时问题最明显)。
- 对于标准模式可以采用以下任何一种文档类型来开启:
<!-- HTML 4.01 严格型 -->
<!DOCTYPE HTML PUBLIC
"-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd"><!-- XHTML 1.0 严格型 -->
<!DOCTYPE html PUBLIC
"-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><!-- HTML 5 -->
<!DOCTYPE html>
- 对于准标准模式,则可以通过使用过渡型(transitional)或框架集型(frameset)文档类型来触发。
<!-- HTML 4.01 过渡型 -->
<!DOCTYPE HTML PUBLIC
"-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd"><!-- HTML 4.01 框架集型 -->
<!DOCTYPE HTML PUBLIC
"-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd"><!-- XHTML 1.0 过渡型 -->
<!DOCTYPE html PUBLIC
"-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><!-- XHTML 1.0 框架集型 -->
<!DOCTYPE html PUBLIC
"-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
- 准标准模式和标准模式非常接近,他们差异几乎可以忽略不急。因此,当有人提到“标准模式”时,有可能是指这两种模式中的任何一种。
<noscript>元素
在不支持JavaScript的浏览器中显示替代的内容,这个元素可以包含能够出现在文档中的任何HTML元素(<script>元素除外)。包含在<noscript>元素中的内容只有在下列情况下才会显示出来:
- 浏览器不支持脚本
- 浏览器支持脚本,但脚本被禁用
符合上述任何一个条件,浏览器都会显示<noscript>中的内容,除此之外,浏览器不会呈现<noscript>中的内容。
<html>
<head>
<meta charset="utf-8">
<title>Example</title>
<script type="text/javascript" defer="defer" src="example1.js"></script>
</head>
<body>
<noscript>
<p>
本页面需要浏览器支持(启用)JavaScript。
</p>
</noscript>
</body>
</html>
这个页面会在脚本无效的情况下向用户显示“本页面需要浏览器支持(启用)JavaScript。”而在启用了脚本的浏览器中,用户永远不会看到它—-尽管它是页面的一部分。
小结
- 在包含外部JavaScript文件时,必须将src属性设置为指向相应文件的URL。而这个文件既可以是与包含它的页面位于同一个服务器上的文件,也可以是其他任何域中的文件。
- 所有<script>元素都会按照它们在页面中出现的先后顺序依次进行解析。在不使用defer和async属性的情况下,只有在解析完前面<script>元素中的代码之后,才会开始解析后面<script>元素中的代码。
- 由于浏览器会先解析完不实用defer属性的<script>元素中的代码,然后再解析后面的内容,所以一般应该把<script>元素放在页面最后,即主要内容后面,变迁前面。
- 使用defer属性可以让脚本在文档完全呈现之后再执行,延迟脚本总是按照指定它们的顺序执行。
- 使用async属性可以表示当前脚本不必等待其他脚本,也不必阻塞文档呈现。不能保证异步脚本按照它们在页面中出现的顺序执行。
《javascript高级程序设计(第3版)》-1的更多相关文章
- 1<<33这种写法是错的!!!
1<<33不能这么写,1默认int类型,应该改为(long long)1<<33
- mysql 5.6.33 重置密码后报错
[root@ Desktop]# mysql -uroot -p Enter password: Welcome to the MySQL monitor. Commands end with ; o ...
- 【C语言】++(a++)的写法是错的
http://bbs.csdn.net/topics/390764053 a++得到的是一个右值,++操作需要的是一个左值. ------------------------------------- ...
- [C语言]易错知识点、小知识点复习(1)
1. 计算机只能识别由0和1组成的二进制指令,需要将用高级语言(如C.C++)编写的源程序(.c..cpp)编译成二进制目标文件(.obj).一个程序可以根据需要写在不同的文件里,编译是以文件为单位进 ...
- js自执行函数的几种不同写法的比较
经常需要一个函数自执行,可惜这一种写法是错的: function(){alert(1);}(); 原因是前半段“function(){alert(1);}”被当成了函数声明,而不是一个函数表达式,从 ...
- 菜鸟的Xamarin.Forms前行之路——从新建项目到APP上架各种报错问题解决方法合集(不定时更新)
出自:博客园-半路独行 原文地址:http://www.cnblogs.com/banluduxing/p/7425791.html 本文出自于http://www.cnblogs.com/banlu ...
- django migrate报错:1005 - Can't create table xxx (errno: 150 "Foreign key constraint is incorrectly formed")
自从mysql升级,以及使用mariaDB以来,很多不曾更新django中model的外键, 今天,按以前的思路写完外键之后, migrate命令报错: 1005 - Can't create tab ...
- 《C++primer》v5 第2章 变量和基本类型 读书笔记 习题答案
2.1 int,long long ,short 可表示范围和占用内存空间不同.具体与计算机有关. 无符号类型只能表示0和正数,带符号类型可以表示负数,0,正数. float是单精度,一般占用4个字节 ...
- Go第七篇之规范的接口
接口本身是调用方和实现方均需要遵守的一种协议,大家按照统一的方法命名参数类型和数量来协调逻辑处理的过程. Go 语言中使用组合实现对象特性的描述.对象的内部使用结构体内嵌组合对象应该具有的特性,对外通 ...
- 作为一个新手的Oracle(DBA)学习笔记【转】
一.Oracle的使用 1).启动 *DQL:数据查询语言 *DML:数据操作语言 *DDL:数据定义语言 DCL:数据控制语言 TPL:事务处理语言 CCL:指针控制语言 1.登录 Win+R—cm ...
随机推荐
- Python科学计算库灬numpy
Numpy NumPy是一个功能强大的Python库,主要用于对多维数组执行计算.Numpy许多底层函数实际上是用C编写的,因此它的矩阵向量计算速度是原生Python中无法比拟的. numpy属性 维 ...
- I understand that you would like to know about the Amazon Giveaway
Dear Seller, Greetings from Amazon Seller Support. From your mail, I understand that you would like ...
- Python 中的实用数据挖掘
本文是 2014 年 12 月我在布拉格经济大学做的名为‘ Python 数据科学’讲座的笔记.欢迎通过 @RadimRehurek 进行提问和评论. 本次讲座的目的是展示一些关于机器学习的高级概念. ...
- 20172329 2018-2019《Java软件结构与数据结构》第一周学习总结
2018-2019-20172329 <Java软件结构与数据结构>第一周学习总结 在这学期就已经大二了,也已经步入了学习专业课的核心时间,在这个阶段,我们应该了解自己的学习情况,针对自己 ...
- 线段树---no end
额,还有 :区间操作,交,并,补等 区间合并 扫描线 这些问题有空再研究吧.... 先看j2ee了..... 传送门 版权声明:本文为博主原创文章,未经博主允许不得转载.
- 周总结<2>
本打算在这周日写周总结的,但由于事情太多,还要组织团日活动,所以没时间写.不过上周主要是一些书本上的学习,但是在周日的时候完成了一款小游戏还是比较有成就感的,但是主要是因为html的考试才去做的. 代 ...
- ArrayList和LinkedList源码分析
ArrayList 非线程安全 ArrayList内部是以数组存储元素的.类有以下变量: /*来自于超类AbstractList,使用迭代器时可以通过该值判断集合是否被修改*/ protected t ...
- 浅谈 Sql Server 游标
查询语句可能返回多条记录,如果数据量非常大,需要使用游标来逐条读取查询结果集中的记录.应用程序可以根据需要滚动或浏览其中的数据.本篇介绍游标的概念.分类.以及基本操作等内容. 一:认识游标游标是SQL ...
- (双人项目)四则运算 组员:杨钰宁 闫浩楠 开发语言:Python。
需求分析:1.适用人群:小学生. 2.能进行“+,—,*,/” 的四则运算.难度可以随时修改. 3.提交试卷后可以显示所得分数并显示错题个数. 4.可以显示答对的题及其打错的题的序号. 代码如下: i ...
- 【vue】vue安装卡住/报错
网上有很多教程怎么安装: 安装cnpmnpm install -g cnpm --registry=https://registry.npm.taobao.org 升级npmcnpm install ...