在HTML中，我们经常会遇到一些公共的样式或者脚本，比如导航栏、页脚、按钮样式等，这些公共的部分在整个项目中可能会被多次使用，如果每次都重新编写一遍，不仅浪费时间，而且容易出错，我们需要将这些公共的部分提取出来，形成一个单独的文件，然后在需要的地方引入，这就是所谓的“引入公共部分”。
在HTML中，我们可以使用<link>标签来引入CSS文件，使用<script>标签来引入JavaScript文件，这两个标签都可以直接放在HTML文件的头部，也就是<head>标签内。
1、引入CSS文件
在HTML文件中，我们可以使用<link>标签来引入CSS文件。<link>标签的rel属性用于指定链接的类型，这里的类型是"stylesheet"，表示这是一个样式表。href属性用于指定链接的目标，也就是我们要引入的CSS文件的位置。
如果我们有一个名为"common.css"的CSS文件，我们可以这样引入：
<link rel="stylesheet" href="common.css">
2、引入JavaScript文件
在HTML文件中，我们可以使用<script>标签来引入JavaScript文件。<script>标签的src属性用于指定脚本的来源，也就是我们要引入的JavaScript文件的位置。
如果我们有一个名为"common.js"的JavaScript文件，我们可以这样引入：
<script src="common.js"></script>
3、引入外部资源
除了CSS和JavaScript文件，我们还可以在HTML文件中引入其他类型的资源，比如图片、视频等，这些资源的引入方式和CSS、JavaScript类似，也是通过<link>或<script>标签来实现的。
如果我们有一个名为"logo.png"的图片，我们可以这样引入：
<img src="logo.png" alt="Logo">
以上就是在HTML中引入公共部分的基本方法，在实际开发中，我们通常会将CSS和JavaScript文件放在一个专门的文件夹中，然后在HTML文件中通过相对路径来引用，这样做的好处是可以更好地管理和维护代码。
相关问题与解答
1、Q: 如果我在一个页面中引入了多个CSS和JavaScript文件，它们的顺序会影响页面的加载吗？
A: 是的，浏览器会按照<link>和<script>标签在HTML文件中的顺序来加载这些文件，如果你希望某个文件优先加载，你可以将它放在前面，现代浏览器通常会自动优化加载顺序，所以这个因素对大多数情况影响不大。
2、Q: 我可以将CSS和JavaScript代码直接写在HTML文件中吗？
A: 可以，但是不推荐，将CSS和JavaScript代码直接写在HTML文件中会使代码混乱，不利于维护和修改，这样做还会增加HTML文件的大小，我们应该将CSS和JavaScript代码放在单独的文件中，然后在需要的地方引入。
原创文章，作者：K-seo，如若转载，请注明出处：https://www.kdun.cn/ask/254726.html
微信扫一扫