话题之外题外:
距离1970年1月1日的毫秒数
ECMA5提供内部方法Data.now
复杂选择器实现
复杂选择器实现.png
如:复杂选择器.png
独立选择器库:
JQuery下.png
Callbacks回调对象(函数统一管理)
Callbacks回调对象.png
image.png
如:
统一添加Callbacks.png
为方便管理.png
<script src="../jquery-2.0.3.js"></script>
<script>
function fn1() {
console.log(1);
}
function fn2() {
console.log(2);
}
var a = $.Callbacks()
a.add(fn1)
a.add(fn2)
a.fire();
// 统一管理
a.remove(fn2)
a.fire();
</script>
例如:.png
延迟对象 : 对异步的统一管理Deferred
延迟对象 : 对异步的统一管理.png
如:定时器,ajax,创建js标签,等待dom加载
<script src="../jquery-2.0.3.js"></script>
<script>
//假设我想先输出1在输出2就待把2写到里面了所以要一个Deferred管理
setTimeout(function() {
alert(1)
}, 1000)
alert(2)
</script>
先2后1.png
但是如果想先1后2就待写到里面了但是这样不规范.png
如何使用延迟对象?
官网延迟对象下找方法.png
先存起来然后这个触发后再执行.png
(3184,3295) support : 功能检测
判断是什么浏览器的时候得到是哪个版本,执行不同的操作,版本维护不利,所以用功能检测
功能检测.png
例如新版为ture旧版为false
数据缓存
数据缓存.png
(3308,3652) data() : 数据缓存
方法操作,获取删除设置
先找到一个元素$("xxx")然后调用它的data();方法即可
$("div").data();
//扩展添加
$("div").data("name","hello");
//获取数据
$("div").data("name");
并没有扩展到元素身上,假设是扩展一个对象类型可能造成内存泄露问题JQ有数据缓存机制避免防止元素内存泄漏
(3653,3797) queque() : 队列管理 (入队 : 出队dequeque)
运动效果,顺序管理
<script>
$("div").animate({
left: 10000
})
$("div").animate({
top: 100
})
$("div").animate({
width: 300
})
//定时器是异步的 要怎么判断他们分开写还保持顺序
//先把这三个存在一个队列中 当 这一个走完后 就调用出队的方法 不然后续方法不能执行
</script>
(3803,4229) attr() prop() val() addClass(): 对元素属性的操作
(4300,5218) on() trigger() : 事件操作相关方法
事件的添加,删除,主动触发,委托等等
(5140,6057) DOM操作 : 添加 删除 获取 包装
append appendTo sublings innerHTML DOM筛选
(6058,6620) css()方法 : 针对样式的操作
兼容性,浏览器支持程度,像素,%....单位
(6621,7854) 提交数据和ajax()操作
跨域,load(),script标签等等 ajax() getJson()
(7855,8584) animate() : 运动方法
show() hide() 封装好的效果
(8585,8792) offset() : 位置与尺寸的方法
一个元素距离屏幕的距离offside.left(),获取可视区的宽高,滚动区等等
(8804,8821) JQ支持模块化的支持
不光支持前端规范,AMD也支持commonJS规范
