美文网首页
JavaScript高级程序设计读书笔记(二)之在HTML中使用

JavaScript高级程序设计读书笔记(二)之在HTML中使用

作者: 惶惶不安的青年 | 来源:发表于2017-08-22 18:00 被阅读0次
向HTML文件中插入js就要使用<script>标签。
<script src="index.js"></script>

<script>标签六个属性

1. async:可选的,表示立即执行该脚本,但不妨碍页面其他操作。例如,下载或加载其他脚本。只对外部脚本有效。例子:async="async"
2. charset:可选的,要加载的代码字符集,由于大多数浏览器会忽略所以很少人用。例子:charset="UTF-8"
3. defer:可选的,推迟脚本到文档完成解析和显示在执行,只对外部脚本有效。例子:defer="defer"
4. language:可选的,表示编写代码的脚本语言,大多数浏览器已经废弃,因此没必要用了。例子:language = "JavaScript"
5. src:可选的,表示要加载的外部文件的路径。例子:src="index.js"
6. type:可选的,指定要加载脚本语言,如果不指定默认值是text/javascript。例子:type="text/javascript"

<script>有两种应用方式:html页面嵌套和外部引用。
嵌套代码的时候代码中出现</script>会报错,处理方法是<\/script>。外部引用不会出现问题。外部引用一定要闭合标签,且不能在外部引用<script></script>标签中写入代码。嵌入代码会被忽略。

<script>标签的位置

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>test</title>
    <script></script>//这个位置放置js代码会先加载完才能让用户看到内容,如果较多的话从而让用户感觉慢,体验不好。(不建议)
</head>
<body>
    <div></div>
    <script></script>//这个位置放置js代码会让用户较快的看到内容,从而让用户感觉快,体验较好。(建议在此处放置代码)
</body>
</html>

外部引用vs嵌入代码

- 可维护性:遍即不同的html页面js会造成维护问题,把js代码放在一个文件中就轻松多了。
- 可缓存:如果两个页面公用一个js文件只需要下载一次即可。
- 适应未来:通过外部引用可以减少一些bug。

ie5.5引入文档模式(感觉没啥用)

混杂模式:会让ie浏览器的行为和ie5相同。如果没有文档声明所以浏览器都会开启混杂模式。
标准模式:会让ie浏览器更接进标准
准标准模式:和标准模式差不多(除了在处理图片的间隙上在表格中更为明显不同)。

<noscript>元素

在浏览器不支持js或没有开启js脚本的时候提示用户用的,没啥用估计。。。

总结

<script>标签的使用,及六个属性async、charset、defer、language、src、type功能及使用。标签位置放置和外引比嵌入的优势。
(未完待续。。。)

相关文章

  • 《JavaScript高级程序设计》笔记2:在HTML中使用Ja

    参考原文:《JavaScript高级程序设计》笔记:在HTML中使用Javascript