CSS和JavaScript的常用引入方式的区别和优缺点

CSS和JavaScript的常用引入方式的区别和优缺点

CSS的引用

在HTML里面导入CSS总共有四种方式：

• 内联方式
• 嵌入方式
• 链接方式
• 导入方式

//链接方式
<link rel="stylesheet" type="text/css" href="./03.css">

另外在vscode创建03.css文件，在同一个路径下，./是指同一路径下而. ./是指上一级路径

优点：
这种引入的方式是最常见的，也是我们最符合现代开发的要求。这样书写的优点不仅在于 与其它页面进行共享相同的css代码，节省后期的维护成本，而且当浏览器第二次访问到相同的资源，就可以直接从本地获取资源，减少带宽。提升用户体验。
但是，如果在开发过程中（注意：我的说是开发过程中）这样书写的话，就不利于我们后期的维护，当找寻其中一处代码进行修改的话，就相对比较麻烦。

JavaScript的引用

• 行内导入JS （慎用 不安全）
• 内嵌式
• 外联式

//外联方式
<script type="text/javascript" src="js/script.js"></script>

另外在vscode创建js文件夹下的script.js文件

优点：
写到外部文件中，可以在不同的页面中同时引用，也可以利用到浏览器的缓存机制，
是推荐使用的方式
script标签一旦用于引入外部文件了，就不能再编写代码了，即使编写了浏览器也会忽略，
如果需要则可以再创建一个新的script便签用于编写内部代码