第二章  在HTML中使用Javascript

2.1<script>元素

延迟脚本(defer = "defer")表明脚本在执行时不会影响页面的构造,脚本会被延迟到整个页面都解析完毕后再运行。相当于告诉浏览器立即下载,但延迟执行。HTML5规定要求脚本按照它们出现的先后顺序执行。

异步脚本(async)如果有多个脚本文件,执行顺序不确定,指定async属性的目的是不让页面等待两个脚本下载和执行,从而异步加载页面其他内容。

XHTML代码的规则比编写HTML严格得多,下面的代码块在HTML中是有效地,但是在XHMTL中是无效的

<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>

  在XHTML中<(小于号)在XHMTL中将被当作开始一个新标签来解析,但是作为标签来讲,小于号后面不能跟空格,因此导致语法错误。可以使用&lt;代替小于号。

  保证能再XHTML中能正常执行的另外一个方式是用一个CData片段来包含Javascript代码,如下所示

<script type="text/javascript"><![CDATA{
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>

  在兼容CDATA的浏览器中,该方法可以解决问题,还有不少浏览器不兼容XHTML,不支持CDATA片段,使用Javascript注释掉标记即可,如下所示

<script type="text/javascript">
//<![CDATA{
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>

2.3文档模式

混杂模式(quirks mode)会让IE的行为与IE5相同,

标准模式(standards mode)让IE的行为更接近标准行为。

这两种模式主要影响CSS内容的呈现,但在某些情况下也会影响到Javascript的解释执行。

如果在文档开始处没有发现文档类型声明,则所有浏览器都会默认开启混杂模式,不推荐这种做法,不同浏览器在这种模式下的行为差异非常大。

  IE又提出了一种准标准模式(almost standards mode),这种模式下的浏览器很多都是符合标准的。准标准模式可以通过过渡型或框架集型文档类型来触发。

2.4 <noscript>元素

  包含在<noscript>元素中的内容只有在下列情况下才会显示出来:

  • 浏览器不支持脚本
  • 浏览器支持脚本,但脚本被禁用

  符合上述任何一个标准,浏览器都会显示<noscript>中的内容

 

Javascript高级程序设计读书笔记(第二章)的更多相关文章

  1. JavaScript高级程序设计 读书笔记 第二章

    <script>元素 直接在页面中嵌入JavaSript代码或包含外部JavaSript文件. 在代码中任何地方不能出现</script>,可通过转义字符'\'解决. 在XHT ...

  2. JavaScript高级程序设计学习笔记第二章

    1.向 HTML 页面中插入 JavaScript 的主要方法,就是使用<script>元素 2.HTML 4.01中定义了<script>元素的六个属性(方便记忆,可将6个属 ...

  3. JavaScript高级程序设计 读书笔记 第一章

    JavaScript是一种专门为与网页交互而设计的脚本语言 JavaScript实现 ECMAscript---核心 DOM---文档对象模型 BOM---浏览器对象模型

  4. 《JavaScript高级程序设计》笔记——第一章到第三章

    2019年,新年伊始,我打算好好重读一下<JavaScript高级程序设计>这本前端必备经典书.每天半小时. 以下内容摘自<JavaScript高级程序设计> 2019-2-1 ...

  5. JavaScript高级程序设计 读书笔记

    第一章 JavaScript 简介 第二章 Html中使用JavaScript 第三章 基本概念 第四章 变量,作用域,内存 第五章 引用类型 第六章 面向对象 第七章 函数表达式 第八章 BOM 第 ...

  6. javascript高级程序设计读书笔记-事件(一)

    读书笔记,写的很乱   事件处理程序   事件处理程序分为三种: 1.html事件2. DOM0级,3,DOM2级别  没有DOM1 同样的事件 DOM0会顶掉html事件   因为他们都是属性  而 ...

  7. javascript高级程序设计 读书笔记1

    第二章  在HTML中使用JS 加载JS有三种:行内,head头部和外部链接JS   最好使用外部链接<script src="example.js" ></sc ...

  8. Javascript高级程序设计读书笔记(第六章)

    第6章  面向对象的程序设计 6.2 创建对象 创建某个类的实例,必须使用new操作符调用构造函数会经历以下四个步骤: 创建一个新对象: 将构造函数的作用域赋给新对象: 执行构造函数中的代码: 返回新 ...

  9. Javascript高级程序设计读书笔记(第10章 DOM)

    第10章 DOM 10.1  节点层次 每个节点都有一个nodeType属性,用于表明节点的类型.任何节点类型必是下面中的一个: Node.Element_NODE(1); NODE.ATTRIBUT ...

随机推荐

  1. EasyUI 1.4.4 DataGrid(大数据量) bufferview滚动时不加载下一页数据解决方案

    在使用Easyui DataGrid 过程中,发现若单页数据量超过300,IE浏览器加载速度很慢.也通过网上找寻了很多解决方案,最典型的就是去掉datagrid的自动列宽以及自动行高判断. 1.解决自 ...

  2. SqlServer跨域查询

    SELECT * FROM OPENDATASOURCE('SQLOLEDB','Data Source=192.168.1.14;User ID=sa;Password=sql.com').eBui ...

  3. POj3421 X-factor Chains(质因数分解+排列组合)

    POj3421X-factor Chains 一开始没读懂题意,不太明白 Xi | Xi+1 where a | b means a perfectly divides into b的意思,后来才发现 ...

  4. C++ 知识点 2

    基本类型常量 const int a; int const a; const int *a; int * const a; int const * a const; 之间的区别? const int ...

  5. smarty练习:数据的增删改

    根据数据库中的三张表格:timu,xuanxiang,kemu来进行数据的增删改查,并且使用smarty模版将前端与后台分离开来 三张表格: 主页面后台 main.php: <?php //引入 ...

  6. php 之 数据访问

    数据访问: 方式一:已过时,只做了解 1.造一个连接(建立通道) $db=mysql_connect("localhost","root","123& ...

  7. EC2.0开启多规格后,编辑无法获取规格数据

    我们其实一共碰到2个问题, 1. 一个是弹出了货品编辑画面,但是货品的明细没有2.有货品明细但是货品明细各个字段都是空的, 上面2种情况数据库都是有值的. 第一个问题解决方案: 修改html中的JS ...

  8. 布局共享(列如所有activity拥有相同的布局部分,比如actionbar,在BaseActivity中写入布局)

    有时候界面上会用到统一的布局,比如toolbar,你可能会想到在用到的地方都去加上toobar这样对于程序的开发与维护来说都显得特别麻烦,我们可以将他写在父类中. 首先创建一个BaseActivity ...

  9. Windows脚本 - %~dp0的含义

    含义是:更改当前目录为批处理本身的目录,有些晕吧?不急,我举例 比如你有个批处理a.bat在D:\qq文件夹下  a.bat内容为 cd /d %~dp0 在这里,cd /d %~dp0的意思就是cd ...

  10. coalesce和nvl函数

    coalesce 函数 : Oracle COALESCE函数语法为COALESCE(表达式1,表达式2,...,表达式n),n>=2,此表达式的功能为返回第一个不为空的表达式,如果 都为空则返 ...