第2章 HTML中使用JavaScript

javascript 包含:

• 1.ECMAScript 提供核心语言功能
• 2.文档对象模型DOM 提供访问和操作网页内容的方法和接口
• 3.浏览器对象模型DOM 提供与浏览器交互的方法和接口

<script>属性：

• async 可选。立即加载，只对外部文件有效，多个存在时不保证先后顺序执行，一定会在load事件前执行，可能会在DOMContentLoad之前或之后执行。属性无需等号，XHTML中async =“async”
• defer 可选。延迟加载，只对外部文件有效，HTML5规范要求按照先后执行，但是现实不一定，所以建议只写一个并且写在最后。
• charset 可选。大多数浏览器会忽略这个值，所以很少人用
• src 可选。要加载外部文件的路径，如果填写后内部还写js脚本，内部脚本会被忽略。
• type 必选。内容类型（MIME）默认text/javascript,非IE浏览器中还可以使用application/javascript

XHTML（可扩展超文本标记语言）用法:

错误示例
function compare(a,b){
//在XHTML中 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")
	}
}

正确方式
function compare(a,b){
//在XHTML中 a < b的 < 号改成html相应的实体
	if(a &lt; b){ 
		alert("a is less than b")
	}else if(a > b){
		alert("a is greater than b")
	}else{
		alert("a is equal to b")
	}
}

正确方式 外面套一圈CDATA
<! [CDATA[
function compare(a,b){
//在XHTML中 a < b的 < 号改成html相应的实体
	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")
	}
}
]]>

正确方式 由于有些浏览器不兼容XHTML，所以可以再注释掉（注释hack）

// <! [CDATA[
function compare(a,b){
//在XHTML中 a < b的 < 号改成html相应的实体
	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")
	}
}
// ]]>

优化：
尽可能使用外部文件，
优点：
1.可维护性：存在一个文件夹可以专注写js。
2.可缓存：因为浏览器可以缓存相同外部文件，不同页面加载同一文件只需要加载一次，最终结果能够加快页面加载速度。
3.适应未来，外部文件无需使用前面提到的XHTML或注释hack

文档模式

1.混杂模式（不建议）
2.标准模式
3.准标准模式

浏览器默认混杂模式

<noscript>
浏览器不支持javascript时显示里面的内容，能够显示html