JavaScript学习笔记——JavaScript与HTML的组合方式
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了JavaScript学习笔记——JavaScript与HTML的组合方式相关的知识，希望对你有一定的参考价值。
一、javascript可以写在html页面内部，通过<script>标签，如下面代码中的粗体部分：
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> console.log("hello World!"); </script> </head> <body> </body> </html>
二、JavaScript还可以写在单独的文件中，以“.js”为后缀，HTML语言通过<script>标签的src属性引入，如下面代码中的粗体部分：
js文件夹下新建javascript0.js文件：
console.log("hello world!");
HTML代码如下：
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> console.log("hello World!"); </script> <script src="js/javascript0.js" type="text/javascript" charset="utf-8"></script> </head> <body> </body> </html>
粗体部分为引入js/javascript0.js文件的写法，效果与写入HTML文件效果一样，这样做有两个好处：
1.代码复用
2.结构清晰
此处应该注意两点：
1.在js文件中不需要再写<script>标签， 该标签是告诉浏览器引擎，标签内为javascript代码，而js文件已经表明这是javascript代码。
2.在引入外部javascript文件的<script>标签内不可以再编写javascript代码，即使编写也不会起作用。
三、javascript代码是按照在html中的顺序执行。那么一般就会把javascript写在文件最后，或者写在javascript的一个方法中，该方法是在页面加载后才知性。这样做有两个好处：
1.提高页面加载速度，因为javascript代码执行时，后面的html代码将不会被渲染；另外，js文件下载也需要时间。提高用户体验。
2.防止javascript代码操作的DOM还没有加载完成。造成异常。
以上是关于JavaScript学习笔记——JavaScript与HTML的组合方式的主要内容，如果未能解决你的问题，请参考以下文章