预备知识

JavaScript web 开发人员必须学习的 3 门语言中的一门：

HTML 定义了网页的内容
CSS 描述了网页的布局
JavaScript 网页的行为

如何编写JavaScript？

可以用任何文本编辑器来编写 JavaScript 。常用工具：
1）VisualStudio Code
2）Sublime Text
3）NotePad++
注意：不可以用Word或写字板来编写 JavaScript 或 HTML，因为带格式的文本保存后不是纯文本文件，无法被浏览器正常读取。也尽量不要用记事本编写，它会自作聪明地在保存UTF-8格式文本时添加BOM头。

如何运行JavaScript

要让浏览器运行 JavaScript，必须先有一个 HTML 页面，在 HTML 页面中引入 JavaScript，然后让浏览器加载该 HTML 页面，就可以执行 JavaScript 代码。

使用 JavaScript的两种方式

1. 脚本是直接写在 HTML 页面

直接将JavaScript代码写在 <script></script> 中间，形如： <script> JavaScript 脚本内容 </script>
说明：
<script> 标签既可以放在 <head> 部分，也可以放在 <body> 部分，一般放在结束标签 </body>之前。
原因：
浏览器是遇到 <body> 标签开始呈现内容，如果将所有的 <script> 标签都放在 <head> 中，那么网页必须等到所有脚本加载完成之后才开始呈现内容，这样在加载完成之前页面将一片空白。为了避免这个问题，所以建议将所有的 <script> 放在 <body>结束标签之前。

可以比较以下示例 3 和 4 的展示效果。

2. 通过外部脚本文件导入

单独写一个脚本文件（以.js结尾的文件）然后在 HTML 页面通过“<script src="..."></script>”引入这个文件。
说明：
1）如果在 script 标签是用来导入外部脚本文件的，那么不可以在开始标签和结束标签之间再去添加代码了
2）外部脚本文件中不能包含 <script> 标签
3）把JavaScript放在一个单独的.js文件中，更利于维护代码，并且多个页面可以各自引用同一份.js文件。

script 标签

无论脚本是直接写在 HTML 页面中，还是通过导入外部脚本文件，都需要用到 script 标签。
script标签的属性：
1）src 可选，表示包含要执行代码的外部文件。
2)）type 可选，可以看成是 language 的替代属性，表示编写代码使用的脚本语言的类型。
默认的type就是"text/JavaScript"。
3）defer 可选，延迟脚本，只适用于外部脚本文件
该属性的用途告诉浏览器，立即下载脚本，但是延迟到整个页面都解析完毕后再运行。
此时，即使将 <script> 标签放在 <head> 元素中，其中的脚本也会延迟到浏览器遇到 </html> 再执行。
4）async 可选，延迟脚本，只适用于外部脚本文件
该属性的用途是告诉浏览器，立即下载脚本，但是延迟到整个页面都解析完毕再运行。
与 defer 不同的是，标记为 async 的脚本并不保证按照指定他们的先后顺序执行。
5）charset 可选，表示通过 src 属性指定的代码的字符集，很少使用。

示例

示例一：

<!DOCTYPE html>
<html>
<head>
	<title>First Javascript</title>
	<script type="text/javascript">
		alert("Hello World!");
	</script>
</head>
<body>
</body>
</html>

示例二：

//script 标签放在 <body> 中
<!DOCTYPE html>
<html>
<head>
	<title>First Javascript</title>
</head>
<body>
	<script type="text/javascript">
		alert("Hello World!");
	</script>
</body>
</html>

示例三

<!DOCTYPE html>
<html>
<head>
	<title>First Javascript</title>
</head>
<body>
	<script type="text/javascript">
		document.write("Hello World!");
	</script>
	<p> 
		第一个 JavaScript 示例.
	</p>
</body>
</html>

示例四

<!DOCTYPE html>
<html>
<head>
	<title>First Javascript</title>
</head>
<body>
	<p> 
		第一个 JavaScript 示例.
	</p>
	</br>
	<script type="text/javascript">
		document.write("Hello World!");
	</script>
</body>
</html>

示例五

<html>
<head>
	<script src="/JavaScript/abc.js"> </script>
</head>
</html>

在根目录下创建abc.js， 内容如下（注意：仅有如下一行，没有script标签）：
alert("hello world");

参考
http://www.51zxw.net/list.aspx?cid=563
http://www.runoob.com/js/js-tutorial.html
《JavaScript 高级程序设计》

声明：
本博客的所有内容，仅是自己的一些学习笔记，如有错误，欢迎指正。如有侵权，请告知修改。

JavaScript 学习笔记二：基本知识

文章目录