1.JavaScript 用法
在HTML中必须将js代码放在<script type="text/javascript"></script>标签中
<script type="text/javascript"></script>标签可以放置在 HTML 页面的 <body> 和 <head> 部分中
2.关于script元素的属性
属性 值 含义
async async 规定异步执行脚本,就是立即下载脚本,不妨碍其他的操作(仅适用于外部脚本)。
charset charset 规定在脚本中使用的字符编码,大部分浏览器会忽略,很少使用(仅适用于外部脚本)。
defer defer 规定当页面已完成解析后,执行脚本(仅适用于外部脚本)。
src URL 规定外部脚本的 URL。
type MIME-type 规定脚本的 MIME 类型。
3.使用
<script type="text/javascript">
function say(){
alert('hi');
}
</script>
但是如果你想弹出一个</script>标签的字符串,那么浏览器会误解成JS代码已经结束了。解决的方法,就是把字符串分成两个部分,通过连接符‘+’来连接。
<script type="text/javascript">
alert('</scr'+'ipt>');
</script>
2.外部引入js文件
一般来说,JS代码越来越庞大的时候,我们最好把他另存为一个.js文件,通过src引入即可。它还具有维护性高、可缓存(加载一次,无需加载)、方便未来扩展的特点。
<script type="text/javascript" src="script元素.js"></script>
引用外部文件的好处:
1.可维护性,将js放在一个文件中,维护起来会很方便
2.可缓存,浏览器会根据设置缓存链接的所有的外部js文件,也就是说两个页面使用一个js文件,浏览器只用加载一次
3.适应未来。
4.标签的位置
按照常规,我们会把<script>标签存放到<head>...</head>之间。但有时也会放在body之间。
如果放在head中,就意味着要等js全部加载完后才会加载页面内容,这也就导致会出现一段时间的空白页面。为了避免这种情况将js放在body中.
5. 延迟脚本
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript" src="a1.js" defer="defer"></script>
<script type="text/javascript" src="a2.js" defer="defer"></script>
</head>
我们将js的引用放在head中,利用defer属性进行延迟加载,但是有两个js都有defer属性时,顺序是不一定的,也就是说可能先加载a2.js,并且defer属性只用于引用外部的js。所以还是放在body中比较好。
6.异步脚本
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript" src="a1.js" defer="defer"></script>
<script type="text/javascript" src="a2.js" defer="defer"></script>
</head>
异步加载,是适用于外部引用文件,因为是异步的,所以a2.js是很有可能会在a1.js,所以js之间是不能有依赖的关系的。其实异步的目的是让页面的其他的内容不用等待这两个js的加载完成。
7.标签
使用的情况:
1.浏览器不支持js脚本
2.浏览器支持,但是脚本被禁用
<nosciprt>可以平稳退化不支持JavaScript处理:
例如:
<body>
<noscript>
抱歉该浏览器不支持js
</noscript>
</body>