首页 > 其他分享 >封装jquery

封装jquery

时间:2022-11-23 22:48:19浏览次数:51  
标签:jquery jQuery 封装 target src length copy name

jquery

初始化一个函数

function jQuery(selector) {   
return new jQuery.fn.init(selector);  }

手写each函数

 each(callback) {
      for (var i = 0; i < this.length; i++) {
        callback(this[i]);
      }
      return this;
    },

手写显示与隐藏

 toggle() {
      this.each(function (item) {
        if (item.style.display != "none") {
          item.style.display = "none";
        } else {
          item.style.display = "block";
        }
      });
    },

定义构造函数显示原型

jQuery.fn =jQuery.prototype = {
		constructor:jQuery,
		jquery:"9.0.0",
		length:0,
		get(index){
			return this[index];
		},

全局访问

window.$ = window.jQuery = jQuery;

extend方法

jQuery.extend = jQuery.fn.extend = function () {
    var options, name, src, copy, copyIsArray, clone,
      target = arguments[0] || {},
      i = 1,
      length = arguments.length,
      deep = false;
    if (typeof target === "boolean") {
      deep = target;
      target = arguments[i] || {};
      i++;
    }
    if (typeof target !== "object" && !isFunction(target)) {
      target = {};
    }
    if (i === length) {
      target = this;
      i--;
    }
    for (; i < length; i++) {
      if ((options = arguments[i]) != null) {
        for (name in options) {
          src = target[name];
          copy = options[name];
          if (target === copy) {
            continue;
          }
          if (deep && copy && (jQuery.isPlainObject(copy) ||
            (copyIsArray = Array.isArray(copy)))) {
            if (copyIsArray) {
              copyIsArray = false;
              clone = src && Array.isArray(src) ? src : [];
            } else {
              clone = src && jQuery.isPlainObject(src) ? src : {};
            }
            target[name] = jQuery.extend(deep, clone, copy);
          } else if (copy !== undefined) {
            target[name] = copy;
          }
        }
      }
    }
    return target;
  }

标签:jquery,jQuery,封装,target,src,length,copy,name
From: https://www.cnblogs.com/aureazjl/p/16920397.html

相关文章

  • QT图片查看器封装-鼠标中心缩放、移动、截图、框选、切换播放
    Qt图片查看器目录1      简介...12      功能实现...22.1     图片以鼠标为中心放大缩小功能...22.2     图片移动功能...42.3   ......
  • 9. Redis封装使用
    可直接使用如下代码,对redis进行直接的使用。封装代码:importredisimportosdefsingleton(cls):  """单例模式装饰器"""  instances={}  defget_......
  • JQuery 获取元素位置
    vartop=$("#div_id").offset().top;   //获取div的居上位置varleft=$("#div_id").offset().left;   //获取div的居左位置varheigh......
  • JQuery鼠标跟随效果
    <!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="htt......
  • Jquery取得iframe中元素的几种方法Javascript Jquery获取Iframe的元素、内容或者ID,反
    query取得iframe中元素的几种方法 在iframe子页面获取父页面元素代码如下:$('#objId',parent.document);在父页面获取iframe子页面的元素代码如下:$("#objid",doc......
  • 把socket相关函数封装成类
         book241.cpp和book242.cpp程序已经有点长了,有些啰嗦了,如果还想扩展功能,或用于多进程、多线程,程序结构将非常复杂。    不管是socket通信程序的客户端还......
  • Day19:属性封装详解
    属性封装详解封装即隐藏一些数据,让外部不能直接访问,而是需要通过一些方法才能设置或者访问。首先我们来看未封装的属性被外部调用的情况publicclassStudents{//创建一......
  • jQuery-AJAX get() 和 post()方法,jQuery ajax() 方法
    什么是jQuery?jQuery是一个JavaScript函数库。jQuery是一个轻量级的"写的少,做的多"的JavaScript库。jQuery库包含以下功能:HTML元素选取HTML元素操作CSS......
  • 对el-table进行二次封装
    新建组件:<template><divclass="table-container"><el-table:data="tableData"width="100%":height="height":row-style="{height......
  • 封装适用于CentOS7的MySQL离线包
    1构建一个centos7.6.1810的docker镜像,用于下载MySQL+xtrabackup所需安装包7.6.1810的docker镜像,低版本最小安装,会尽可能把所需的包拉齐。Dockerfile文件如下FROMcent......