jQuery库有很多简单实用的API,但是不了解里面代码运行原理的话就不能很好的运用它们,在写这篇日记前我先操作了几个简单的API帮助自己熟悉代码,下面是我的一些心得:
写jQuery代码需要知道怎么封装函数,怎么写命名空间,实现无侵入代码等等。
我先学习使用了几个API,知道了jquery是一个js工具类库,封装了常用的DOM操作方法,有更好的兼容性,利用jquery提供的api,可以完成以下工作:
ajax操作
第三方插件可以使用
事件绑定操作
元素样式的操作
DOM事件的操作
动画设置
jQuery对象就只能使用jQuery的方法,原生DOM对象只能使用原生DOM的方法
如何转换:
获取jQuery对象
$('#xxx')
获取DOM对象
document.getElementById('xxx')
on替代了bind,delegate,live,成为写代码首选绑定事件的工具
举个小例子,做一个addClass和setText的API:
window.jQuery = function( nodeOrSlector ){
let nodes = {}
if (typeof nodeOrSlector === 'string' ){
let temp = document.querySelectorAll( nodeOrSlector )
for ( let i = 0; i<temp.length; i++){
nodes[i] = temp[i]
}
nodes.length = temp.length
}else if (nodeOrSlector instanceof Node) {
nodes = {
0:nodeOrSlector
length:1
}
}
nodes.addClass= function(classes){
classes.forEach( (value) => this.classList.add(value) )
}
nodes.setText = function(text){
for(let i = 0;i < nodes.length; i++){
nodes[i].textContent = text
}
}
return nodes
}
实现API首要的就是先能够取得函数返回的关键变量值,才能成功引用函数API。
初探jQuery,过几天系统的整理一下笔记。
网友评论