<script>元素
向html页面中插进去js的重要要领就是运用<script>元素。
运用<script>元素的体式格局有两种:直接在页面中嵌入js代码和包括外部js文件。
直接在页面中嵌入js代码以下:
<script type="text/javascript">
function sayHi(){
alert("Hi!");
}
</script>
外部js文件引入体式格局:
<script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
耽误剧本 defer
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Example HTML Page</title>
<meta name="description" content=""/>
<meta name="keywords" content=""/>
<link type="text/css" rel="stylesheet" href="css/reset.css"/>
<link type="text/css" rel="stylesheet" href="css/main.css"/>
<script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
<script type="text/javascript" defer="defer" src="example1.js"></script>
</head>
<body>
<!--这里是内容-->
</body>
</html>
<script>标签定义了defer属性。这个属性的用处是表明剧本在实行时不会影响页面的组织。也就是说,剧本会被耽误到全部页面都剖析终了后再运行。因而,在<script>元素中设置defer属性,相当于通知浏览器马上下载,但耽误实行。
在这个例子中,虽然我们把<script>元素放在了文档的<head>元素中,但个中包括的剧本将耽误到浏览器碰到</html>标签后再实行。
异步加载 async
指定async属性的目标是不让页面守候两个剧本下载和实行,从而异步加载页面其他内容,为此,发起异步剧本不要在加载时期修正DOM。
异步剧本一定会再页面load事宜前实行,但可能会再DOMContentLoaded事宜触发之前或以后实行。
就是在head标签之间加上代码:
<script type="text/javascript" async src="example1.js"></script>
文档形式
最初的俩种文档形式是:混淆形式(quirks mode)和规范形式(standards mode)。混淆形式会让IE的行动与(包括非规范特征的)IE5雷同,而规范形式则让IE的行动更靠近规范行动。
如果在文档最先初没有发明文档范例声明,则一切浏览器都邑默许开启混淆形式。
<noscript>元素
包括在<noscript>元素中的内容只要在以下情况下才会显示出来:
- 浏览器不支撑剧本
- 浏览器支撑剧本,但剧本被禁用
<body>
<noscript>
<p>本页面须要浏览器支撑(启动)JavaScript</p>
</noscript>
</body>