window.jQuery = function(nodeOrSelector) {
var nodes = {}
//包装这个要返回的jQuery对象
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 if(nodeOrSelector instanceof Node) {
nodes = {0: nodeOrSelector, length: 1}
}
console.log('nodes', nodes)
nodes.getSiblings = function() {
var allChildren = node.parentNode.children
var siblings = {length:0}
for(var i = 0; i < allChildren.length; i++) {
if(allChildren[i] !== node) {
siblings[siblings.length++] = allChildren[i]
}
}
console.log(siblings)
return siblings
},
nodes.addClass = function(classes) {
classes.forEach((value) => {
for(var i = 0; i < nodes.length; i++) {
nodes[i].classList.add(value)
}
})
},
nodes.text = function(text) {
if(text === undefined) { //getText
var texts = []
for(var i = 0; i < nodes.length; i++) {
texts.push(nodes[i].textContent)
}
console.log(texts)
return texts
} else { //setText
for(var i = 0; i < nodes.length; i++) {
nodes[i].textContent = text
}
}
}
return nodes
}
使用:
var my_node = jQuery('ul>li')
更加简洁的使用:
window.$ = jQuery
var my_node2 = $('ul>li')
【JavaScript】实现两个jQuery API
最新推荐文章于 2022-11-25 23:11:09 发布