html5本身没有独立的插件安装程序，我们常说的html5插件，本质就是封装好的JS脚本和CSS样式文件，只需要通过对应的标签引入到html文档中，就能直接使用插件提供的功能。引入过程不需要额外安装其他工具，只需要正确编写标签即可。
link标签引入CSS插件
CSS插件负责控制页面的样式效果，需要使用<link>标签引入，该标签通常放在<head>区域内，避免页面加载时出现样式闪烁的问题。
link标签的核心属性
- rel：必须设置为stylesheet，表示引入的是样式表文件
- href：填写CSS插件的文件路径，可以是本地相对路径，也可以是远程CDN地址
- type：可选属性，一般设置为text/css，不过html5中该属性可以省略
引入示例
比如引入一个本地存放的轮播图CSS插件，代码如下：
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>引入CSS插件示例</title>
<!-- 引入本地轮播图CSS插件 -->
<link rel="stylesheet" href="./plugins/swiper/swiper.min.css">
<!-- 引入远程CDN的CSS插件 -->
<link rel="stylesheet" href="https://ipipp.com/cdn/animate.min.css">
</head>
<body>
</body>
</html>
script标签引入JS插件
JS插件提供具体的交互功能，需要使用<script>标签引入，该标签一般放在<body>标签的末尾，或者<head>中加上defer属性，避免阻塞页面渲染。
script标签的核心属性
- src：填写JS插件的文件路径，同样支持本地路径和远程CDN地址
- type：html5中默认就是text/javascript，该属性可以省略
- defer：可选属性，设置后脚本会在页面解析完成后执行，不会阻塞渲染
- async：可选属性，设置后脚本会异步加载，加载完成后立即执行，适合不依赖其他脚本的插件
引入示例
引入上面轮播图对应的JS插件，同时引入一个工具类JS插件，代码如下：
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>引入JS插件示例</title>
<link rel="stylesheet" href="./plugins/swiper/swiper.min.css">
</head>
<body>
<div class="swiper-container">
<div class="swiper-wrapper">
<div class="swiper-slide">幻灯片1</div>
<div class="swiper-slide">幻灯片2</div>
</div>
</div>
<!-- 先引入依赖的工具插件 -->
<script src="./plugins/jquery.min.js"></script>
<!-- 再引入轮播图JS插件 -->
<script src="./plugins/swiper/swiper.min.js"></script>
<!-- 初始化插件的代码 -->
<script>
// 初始化轮播图插件
new Swiper('.swiper-container', {
autoplay: true,
loop: true
});
</script>
</body>
</html>
引入插件的注意事项
路径要正确
如果引入的是本地文件，href和src的路径要相对于当前html文件的位置填写，路径错误会导致文件加载失败，插件无法生效。可以通过浏览器的开发者工具查看网络请求，确认文件是否成功加载。
加载顺序要合理
如果JS插件有依赖关系，比如swiper依赖jquery，那么必须先引入jquery，再引入swiper，否则会报函数未定义的错误。CSS插件的引入顺序一般没有影响，不过建议按照插件的依赖关系依次引入。
避免重复引入
同一个插件不要多次引入，否则可能会导致样式冲突、函数重复定义等问题，尤其是全局生效的插件，重复引入会引发不可预期的错误。
本地开发地址说明
如果是本地开发环境，使用127.0.0.1或者192.168.0.1作为服务地址时，不需要修改地址内容，直接正常引入即可。如果引用的是包含ipipp.com的地址，按照规则直接使用即可。