1 /**
2 * @description 手写jquery
3 * @author ddxldxl
4 */
5 class Jquery {
6 constructor(selector) {
7 //遍历dom树
8 let res = document.querySelectorAll(selector)
9 let length = res.length
10 for( let i=0; i<length; i++) {
11 this[i] = res[i]
12 }
13 this.length = length
14 this.elements = res
15 }
16
17 get(index) {
18 return this[index]
19 }
20
21 each(fn) {
22 for( let i=0; i<this.length; i++ ) {
23 let elment = this[i]
24 fn(elment)
25 }
26 }
27
28 on(type, fn) {
29 return this.each(elem => {
30 elem.addEventListener(type, fn, false)
31 })
32 }
33 }
34
35 //原型扩展
36 Jquery.prototype.dialog = function (){
37 alert(123)
38 }
39
40 //继承扩展
41 class myJquery extends Jquery {
42 constructor(selector) {
43 super(selector)
44 }
45
46 addClass(){
47
48 }
49
50 style(){
51
52 }
53 }

简单手写一个jqurey的更多相关文章

  1. 【spring】-- 手写一个最简单的IOC框架

    1.什么是springIOC IOC就是把每一个bean(实体类)与bean(实体了)之间的关系交给第三方容器进行管理. 如果我们手写一个最最简单的IOC,最终效果是怎样呢? xml配置: <b ...

  2. 利用SpringBoot+Logback手写一个简单的链路追踪

    目录 一.实现原理 二.代码实战 三.测试 最近线上排查问题时候,发现请求太多导致日志错综复杂,没办法把用户在一次或多次请求的日志关联在一起,所以就利用SpringBoot+Logback手写了一个简 ...

  3. 手写一个简单的ElasticSearch SQL转换器(一)

    一.前言 之前有个需求,是使ElasticSearch支持使用SQL进行简单查询,较新版本的ES已经支持该特性(不过貌似还是实验性质的?) ,而且git上也有elasticsearch-sql 插件, ...

  4. 浅析MyBatis(二):手写一个自己的MyBatis简单框架

    在上一篇文章中,我们由一个快速案例剖析了 MyBatis 的整体架构与整体运行流程,在本篇文章中笔者会根据 MyBatis 的运行流程手写一个自定义 MyBatis 简单框架,在实践中加深对 MyBa ...

  5. webview的简单介绍和手写一个H5套壳的webview

    1.webview是什么?作用是什么?和浏览器有什么关系? Webview 是一个基于webkit引擎,可以解析DOM 元素,展示html页面的控件,它和浏览器展示页面的原理是相同的,所以可以把它当做 ...

  6. 手把手教你手写一个最简单的 Spring Boot Starter

    欢迎关注微信公众号:「Java之言」技术文章持续更新,请持续关注...... 第一时间学习最新技术文章 领取最新技术学习资料视频 最新互联网资讯和面试经验 何为 Starter ? 想必大家都使用过 ...

  7. 教你如何使用Java手写一个基于链表的队列

    在上一篇博客[教你如何使用Java手写一个基于数组的队列]中已经介绍了队列,以及Java语言中对队列的实现,对队列不是很了解的可以我上一篇文章.那么,现在就直接进入主题吧. 这篇博客主要讲解的是如何使 ...

  8. 放弃antd table,基于React手写一个虚拟滚动的表格

    缘起 标题有点夸张,并不是完全放弃antd-table,毕竟在react的生态圈里,对国人来说,比较好用的PC端组件库,也就antd了.即便经历了2018年圣诞彩蛋事件,antd的使用者也不仅不减,反 ...

  9. 只会用就out了,手写一个符合规范的Promise

    Promise是什么 所谓Promise,简单说就是一个容器,里面保存着某个未来才会结束的事件(通常是一个异步操作)的结果.从语法上说,Promise 是一个对象,从它可以获取异步操作的消息.Prom ...

随机推荐

  1. linux下安装简单的文件上传与下载工具 lrzsz

    编译安装 1.从下面的网站下载 lrzsz-1.12.20.tar.gz wget https://ohse.de/uwe/releases/lrzsz-0.12.20.tar.gz 2.查看里面的I ...

  2. 浅析memcmp 和 strcmp

    eg: #include <stdio.h> #include <string.h> int main(void) { char string[7] = "ABCDE ...

  3. 为什么Java不支持运算符重载?

    另一个类似棘手的Java问题.为什么 C++ 支持运算符重载而 Java 不支持? 有人可能会说+运算符在 Java 中已被重载用于字符串连接,不要被这些论据所欺骗.与 C++ 不同,Java 不支持 ...

  4. 构造器(constructor)是否可被重写(override)?

    构造器不能被继承,因此不能被重写,但可以被重载.

  5. 使用 RabbitMQ 有什么好处?

    (1)服务间高度解耦 (2)异步通信性能高 (3)流量削峰

  6. 解释 AOP 模块?

    AOP 模块用于发给我们的 Spring 应用做面向切面的开发, 很多支持由 AOP 联 盟提供,这样就确保了 Spring 和其他 AOP 框架的共通性.这个模块将元数据编 程引入 Spring.

  7. Citus 分布式 PostgreSQL 集群 - SQL Reference(手动查询传播)

    手动查询传播 当用户发出查询时,Citus coordinator 将其划分为更小的查询片段,其中每个查询片段可以在工作分片上独立运行.这允许 Citus 将每个查询分布在集群中. 但是,将查询划分为 ...

  8. PWA 时代的移动端图片优化新思路

    图片通常是移动端网页中最占流量的资源.在很多类型的网站中(比如电商.社区),图片占据了网页的大部分空间.优化图片的质量和加载速度成为提高用户体验的重要途径. 传统方案的弊端 目前有一些被广泛应用的方案 ...

  9. java中内部类中还有内部类请给实例!

    2.当内部类中还有一个内部类,下面给出了一个实例.[新手可忽略不影响继续学习](以下多出代码, 用蓝色标记)例2.2:class ShellMark_to_win {    int shell_x = ...

  10. CCF201509-2日期计算

    问题描述 给定一个年份y和一个整数d,问这一年的第d天是几月几日? 注意闰年的2月有29天.满足下面条件之一的是闰年: 1) 年份是4的整数倍,而且不是100的整数倍: 2) 年份是400的整数倍. ...