1、加轮播
直接用swiper的库
$ npm install swiper
image.png
引入swiper.min.css和swiper.min.js
image.png
看下全局对象有没有引入
image.png
image.png
image.png
代码粘贴完,然后修改
image.png
初始化swiper
image.png
然后让轮播好看点,修改代码
去掉滚动条
image.png
image.png
问题:slide3到slide1会有一个空隙
image.png
代码多复制了...
CSS,谁写在后面谁的有限级高
MVC思想
为了解决一写代码就忘记的问题
根据不同的功能来写到不同的js里
模块化
MVC的前提是代码模块化
目前代码的问题:
每个模块里用var声明的变量是全局变量(在哪里都可以使用)
全局变量可以互相骚扰
那就用局部变量,在ES6之前,函数里面才是局部变量
错误例子:用一个花括号把代码括起来,这c,c++是可以的,但是js不行,因为var变量会变量提升
正确方法:声明一个函数括起来,然后再执行这个函数
function(){
}.call()
即立即执行函数
但是chrome会报错误,解决方式在function前面加!
image.png
image.png
如果在括号前面加了比如xxx
(function(){}).call(),那么浏览器会把两行变成一行,即xxx(function(){}).call(),则就有问题了
!就是最好的
问题:那如果2个模块就是要有联系呢?
方法一:让要联系的东西放到window里
image.png
方法二:用闭包
image.png
image.png image.png
返回了匿名函数的函数
初步VC思想
image.png
C思想再改进下
再改进下
image.png
箭头函数没有this
箭头函数的内外this是一样的
image.png
再更新下
image.png
网友评论