querySelector
全局变量可耻，不能用
用全局属性，那么要么会不小心覆盖别人，要么会不小心被别人覆盖
用局部变量
立即调用函数：声明一个函数，然后立即调用这个函数
function (){
var parent = document.querySelector(#self)
console.log(parent)
}.call()
这里就是立即调用函数，匿名函数，并直接在后面加.call()
上面的代码在浏览器里执行可能会报错，解决方法：①把整个代码段用括号括起来
②把括号放到.call之前 ③在function前面加-，是为了告诉浏览器现在不是在声明一个函数，而是在声明并调用求值 ④在function前面加+ ⑥在function前面加！ ⑦在function前面加~
进行JS升级
{
let parent = document.querySelector(#self)
console.log(parent)
}
没升级之前，
{
var parent = document.querySelector(#self)
console.log(parent)
}
等价于
var parent 变量提升，全局变量
{
parent = document.querySelector(#self)
console.log(parent)
}
{
let a=1
}
上面的a就在花括号之内，与下面的a作用域不一样
console.log(a)
方应杭 立即执行函数
阮一峰 source map
1、HTML CSS JS内容、样式、与行为分离
2、轮播的思想
思路1：滚来滚去
思路2：用局部画面骗用户
3、封装思路
从API开始思考
尽量能让使用者猜到
面试题：请说下前端 内容 样式 行为分解的理解
答：从反方向回答，如果不分解，则会
用CSS表示内容，带来的问题是：人类选不中；JS也取不到
用CSS表示行为（IE时代可以）：CSS里如果有一些复杂逻辑，会使得CSS很慢，页面就慢
$div.show() $div.hide() 禁用
方应杭 gitbub里搜doodle
http://js.jirengu.com/mojub/1/edit?html,js,output
以上效果会有一个问题：图片轮播时会抖动（页面的百分比导致的，不是100%）
图片的宽高是明确知道的话，就尽量写出来，避免图片重排导致耗CPU
http://js.jirengu.com/qahew/1/edit?html,js,output 另一种方法
上面的2个JS在操作CSS，违背原则，所以换为下面的一种
http://js.jirengu.com/wocum/1/edit?html,js,output
这种的问题是：当图片数量增加之后，这种写法不利，很繁琐
allButtons.eq(n%3) eq意思是找出对应的DOM，并且把这个DOM封装成一个JQuery对象
等价于$(allButtons(n%3))
siblings接收的是选择器，removeClass接收的是类名
http://js.jirengu.com/yihig/1/edit?html,css,js,output
自动轮播
http://js.jirengu.com/wutuh/1/edit?html,js,output
自动轮播 +代码优化
网友评论