封装jquery时用到的东西

时间:2022-11-22 20:12:15

顺序都是瞎拍的,就是明显分割用

1.将函数封装成$(' ')这种形式

把函数名起成$ $(各种选择器) $(selector)

2.有时候jquery可以继续加点,返回自己本身的元素

创建个构造函数,把它返回 return new 构造函数名(各种选择器)

3.之后的那些个字面量创建的函数怎么办

把这些函数当做构造函数的原型的方法写进原型里

4.可以通过下标取元素怎么做

调用selectAll方法,把所有selector的选择器的东西都存起来写入this,变成伪数组数组中,那么就可以通过this[i]取元素了

还要添加长度

5.try{可能出现错误的代码}catch(e){出错了就走这里}

6.dom元素想变成$元素直接加$(dom)就变了

this[0]=dom;

加长度length=1

7.关键好函数

1)常用的each函数遍历this[i]的元素,也就是取出selector的每个元素

each: function (fn) {
  //this是一个伪数组,数组里面装的是每一个dom元素
  for (var i = 0;i < this.length;i++) {
  //将fn里面的this指向变为dom元素
  fn.call(this[i]);
  }
},

之后就可以通过each(function(){

  对每一个函数进行操作

})

2)这个函数要写进构造函数的里面,因为要用到这个函数

//将字符串转换为dom
function stringToDom(str) {

//创建了一个div
var node = document.createElement('div');//做一个中介的容器,来装字符串

node.innerHTML = str;

//childNodes:获取所有的子节点,装了dom元素的数组
return node.childNodes;
}

3)将dom包装成数组

changeDomToArray: function (dom) {
dom = typeof dom == 'string' ? this.selectAll(dom) : dom; 三目运算符

if (!dom.length) {//不是数组
dom = [dom];
}
return dom;
},