本文摘自PHP中文网,作者不言,侵删。
本篇文章给大家带来的内容是关于jQuery的用法介绍(代码),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。
代码部分
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 | <script>
window.jQuery= function (nodeOrSelector){
let nodes={}
let node1=[]
if (typeof nodeOrSelector=== 'string' ){
let temp=document.querySelectorAll(nodeOrSelector)
for (let i=0;i<temp.length;i++){
node1[i]=temp[i]
}
} else if (nodeOrSelector instanceof Node){
node1={
0:nodeOrSelector,
length:1
}
}
nodes.addClass= function (classes){
classes.forEach(value => {
for (let i=0;i<node1.length;i++){
node1[i].classList.add(value)
}
})
}
nodes.setText= function (text){
for (let i=0;i<node1.length;i++){
node1[i].textContent=text
}
}
return nodes
}
window.$=jQuery
var $p =$( 'p' )
$p .addClass([ 'red' ])
$p .setText( 'hi' )
</script>
|
思路
首先声明函数jQuery()并在函数中声明一个封装了两个函数的对象,以实现给元素加class和添加文本的功能;
其次在函数中判断所传参数是否为字符串还是节点;
接着编写addClass与setText方法;
最后返回对象nodes,可以调用对象中的方法,大功告成。
本篇文章到这里就已经全部结束了,更多其他精彩内容可以关注PHP中文网的jQuery视频教程栏目!
以上就是jQuery的用法介绍(代码)的详细内容,更多文章请关注木庄网络博客!
相关阅读 >>
javascript怎么注释多行
javascript 中向上取整、向下取整、四舍五入的操作
javascript中date对象的方法有哪些
javascript怎么删除input
一起看看javascript与css和sass如何进行交互
javascript怎么设置全选
node批量下载文件到本地的方法介绍(附代码)
深入了解javascript中的object(对象)
javascript什么是变量
javascript怎么实现验证码倒计时
更多相关阅读请进入《javascript》频道 >>
人民邮电出版社
本书对 Vue.js 3 技术细节的分析非常可靠,对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪,Vue.js作者
转载请注明出处:木庄网络博客 » jQuery的用法介绍(代码)