jQuery是一个高效、精简并且功能丰富的 JavaScript 工具库。它提供的 API 易于使用且兼容众多浏览器,这让诸如 HTML 文档遍历和操作、事件处理、动画和 Ajax 操作更加简单。最近在学习中,也遇到一些问题,看了看源码,看的一脸懵逼,修为不够很多看不懂的,还是先来仿写简单的API,试着理解理解。
1、首先来看看jQuery的addClass() 方法
(1)定义:addClass() 方法向被选元素添加一个或多个类。该方法不会移除已存在的 class 属性,仅仅添加一个或多个 class 属性。如需添加多个类,可以使用空格分隔类名。
(2)语法:
1>.代码:
$(selector).addClass(class)
2>.参数:class,必需值。规定一个或多个 class 名称。
(3)示例:
1>.代码:
2>.效果:
2、其次是分析需求
从jQuery对应的API可以看出,功能就是增加对应标签的class类名,来到达操作对应标签的目的。
3、最后就是根据需求进行仿写
(1)首先构造一个函数,用于接收并判断传进来的参数是字符串还是节点。同时声明一个伪数组,用于存储接受的字符串或者节点。
(2)分别通过forEach和for接收参数,并进行遍历,编写出两个方法:addClass()和text()。
(3)最后对代码进行封装。
(4)为了和 jQuery 更像。让 window.$ = jQuery; 然后我们再调用即可。
效果如下: