各个封装个简单的jQuery

发表于 | 更新于: | 分类于 | | 阅读次数:

自己封装一个jQuery

下面的代码，封装了一个简单的jQuery API。

some 知识点：

  • jQuery接受一个选择器或者一个节点
  • 类名可以是一个类名字符串，或者是一个类名数组。
  • text方法，允许参数为空，当参数为空时，默认取值。当参数不为空时，默认设置值。

代码如下：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
window.jQuery = function(nodeOrSelector) {
	var nodes = {}
	if(typeof nodeOrSelector === 'string') {
		var temp = document.querySelectorAll(nodeOrSelector)
		for(let i = 0; i < temp.length; i++) {
			nodes[i] = temp[i]
		}
		nodes.length = temp.length
	}else{
		 nodes = {
		 	0: nodeOrSelector,
		 	length: 1
		 }
	}
	nodes.addClass = function(classes) {
      if(typeof classes === 'string'){
        for(let i = 0; i < nodes.length; i++) {
				nodes[i].classList.add(value)
			}
      }else if (Array.isArray(classes)){
        classes.forEach((value) => {
			for(let i = 0; i < nodes.length; i++) {
				nodes[i].classList.add(value)
			}
		})
      }
		
	}
	nodes.text = function(text) {
		if(text === undefined) {
			var texts = []
			for(let i = 0; i < nodes.length; i++) {
				texts.push(nodes[i].textContent)
			}
			return texts;
		}else {
			for(let i = 0; i < nodes.length; i++) {
				nodes[i].textContent = text
			}
		}
	}
	return nodes;
}
var temp = document.querySelectorAll('li')
jQuery(temp[]).addClass(['red'])

(完)

End