1、JS的组成部分:一、核心(ECMAScript)二、文档对象模型(DOM)三、浏览器对象模型(BOM)
2、JS解析器对<script>内所有代码解析完成后,页面中的其他内容才会被浏览器加载或显示
3、浏览器遇到</script>会认为是结束标识,代码中若出现则用转义字符“\”解决
<script type="text/javascript">
function sayScript(){
alert("<\/script>");
}
</script>
4、带src属性的<script>元素若包含了嵌入的代码,则嵌入的代码失效,下载并执行外部脚本
5、现在Web应用一般都把全部JS引用放在<body>元素中页面内容的后面,这样在解析包含的JS代码前,页面内容将完全呈现在浏览器中,让用户感觉打开页面速度加快
<!DOCTYPE html>
<html>
<head>
<title>标题</title>
</head>
<body>
<!-- 代码内容 -->
<script type="text/javascript" src="example1.js"></script>
<script type="text/javascript" src="example2.js"></script>
</body>
</html>
6、延迟脚本
虽然<script>元素写在<head>中,但其中的脚本将延迟到遇到</html>标签后再执行,先于DOMContentLoaded事件(现实当中不一定在DOMContentLoaded事件触发前执行,最好只包含一个延迟脚本)
<!DOCTYPE html>
<html>
<head>
<title>标题</title>
<script type="text/javascript" defer="defer" src="example1.js"></script>
<script type="text/javascript" defer="defer" src="example2.js"></script>
</head>
<body>
<!-- 代码内容 -->
</body>
</html>
7、异步脚本
不保证脚本按顺序执行,因此要确保多个脚本之间互不依赖;目的是不让页面等待脚本下载和执行,所以异步脚本加载期间不要修改DOM;异步脚本一定在页面的load事件前执行,但在DOMContentLoaded事件前后触发不确定
<!DOCTYPE html>
<html>
<head>
<title>标题</title>
<script type="text/javascript" async src="example1.js"></script>
<script type="text/javascript" async src="example2.js"></script>
</head>
<body>
<!-- 代码内容 -->
</body>
</html>
8、外部文件方式文件只需下载一次,快速高效
9、文档模式:通过文档类型(doctype)切换实现;一、混杂模式(不推荐)二、标准模式 三、准标准模式:(1)过度型(2)框架集型;标准与准标准差异很小,基本可以忽略不计
10、<noscript>元素:当浏览器不支持脚本或支持脚本但被禁用时触发显示其中内容
<!DOCTYPE html>
<html>
<head>
<title>标题</title>
<script type="text/javascript" async src="example1.js"></script>
<script type="text/javascript" async src="example2.js"></script>
</head>
<body>
<!-- 代码内容 -->
<noscript>
<p>本页面需要浏览器支持(启用)JS。</p>
</noscript>
</body>
</html>