框架,顾名思义就是一套架构,他会基于自身的特点向用户提供一套较为完整的解决方案. 框架的控制权在框架本身, 使用者要按照框架的某种规范进行开发.

插件一般是为了解决某个问题而专门存在,其功能单一,并且比较小

前端常用的框架有Bootstrap, Vue, Angular, React等. 既能开发PC端, 也能开发移动端.

前端常用的移动端插件有swiper, superslide, iscroll等

框架: 大而全,一整套解决方案
插件: 小而转移, 某个功能的解决方案

bootstrap框架使用方法:
首先,进入链接,下载bootstrap
https://www.bootcss.com/


下载成功后,解压
需要注意的是,由于bootstrap依赖于jquery,如果下载的文件js下面没有jquery开头的,需要下载这个文件.
点击下载
下载第一个即可

如果出现连接超时等错误,请复制你所下载的文件的链接,打开迅雷,用迅雷下载
下载成功后,放入js下即可
接下来,你就可以放心大胆的使用框架了.

首先,打开下面链接
https://v3.bootcss.com/javascript/

假设你要用到轮播图模块,点击下图位置

哦,不,应该先新建index.html文件,引入bootstrap中的几个文件,分别是:
,然后复制刚刚网页上你所点击的地方的代码

,然后,让我们分析以下代码,首先,<ol>肯定是小圆点没错了,然后,看到<img>了吗,肯定是轮播图里面的图片没错了,最后,看<a>里面的left和right了么,聪明的你肯定发现了,没错,肯定是轮播图左右的两个按钮!!!.
到此,我们已经大致明白了代码,把这一串代码放到自己的代码里面,嘿嘿,运行一下,你没有看错,除了没有图片,轮播图的功能已经全部具备了,哈哈哈.然后,只需要往里面放几张图片,嘿嘿,你没有看错,曾经需要写不知道多长时间,掉多少头发的轮播图,就这样轻轻松松的完成了.

什么?你以为到这里就结束了,不,还有别的,看看这个

知道这是什么意思吗,我也不知道,不过让我们看看百度翻译:

原来如此,还可以通过更改参数来设置轮播图的播放效果,没错,就是这么的强大!!!

修改参数的方法,在代码下面写js语句,像这样

<script>
$('.carousel').carousel({
  interval: 2000
})
<script>

来,我们已经知道了interval是滚动的事件,我们把事件换成500ms试试看看会不会变快

果然变快了,哈哈哈,至此教程结束了

求求各位观众老爷们点个赞啦

求求各位观众老爷们点个赞啦

求求各位观众老爷们点个赞啦

求求各位观众老爷们点个赞啦