jquery选择器$('selector')返回的不是数组,而是一个被封装好的jQuery对象,查询到的每一个节点,都被以下标为属性的方式添加到jQuery对象,jQuery对象上的方法包含对象本身的方法和定义在原型上的方法两种,无论何种方法,在每次调用方法后,都会在方法内部返回一个this对象,指向当前的jQuery对象,方便下次链式调用,当然这只是一种非常基本的实现思路,具体思路见:jQuery的链式调用浅析_jquery_脚本之家 (jb51.net)

eg:要实现如下的效果:

$("#idbox").width("100px").height("100px");

则基础原理如下:

let Fun={
fn1:function(){
console.log("fn1");
return this;
},
fn2:function(){
console.log("fn2");
return this;
},
fn3:function(){
console.log("fn3");
return this;
}
} Fun.fn1().fn2();

jquery链式调用原理的更多相关文章

  1. jquery中链式调用原理

    (1).链式调用 $("#mybtn").css("width","100px") .css("height",&quo ...

  2. js链式调用 柯里化

    var d = 1; d.add(2).add(3).add(4) //输出10 写出这个add函数 Number.prototype.add = function(x){ return this + ...

  3. mark jquery 链式调用的js原理

    我们在使用jquery的时候会用到类似$("#id").css('color','red').show(200); 这样写有点减少代码量,减少了逐步查询DOM的性能损耗: js 原 ...

  4. [js高手之路] 设计模式系列课程 - jQuery的链式调用与灵活的构造函数

    一.我们从一个简单的构造函数+原型程序开始 var G = function(){}; G.prototype = { length : 5, size : function(){ return th ...

  5. 34、[源码]-AOP原理-链式调用通知方法

    34.[源码]-AOP原理-链式调用通知方法

  6. promise链式调用的应用

    then在链式调用时,会等前一个then或者函数执行完毕,返回状态,才会执行回调函数. (1)代码顺序执行,第一步调用了函数cook ,cook执行返回了一个promise,promise返回的是成功 ...

  7. 如何写 JS 的链式调用 ---》JS 设计模式《----方法的链式调用

    1.以$ 函数为例.通常返回一个HTML元素或一个元素集合. 代码如下: function $(){ var elements = []; ;i<arguments.length;i++){ v ...

  8. jQuery链式操作[转]

    用过jQuery的朋友都知道他强大的链式操作,方便,简洁,易于理解,如下 $("has_children").click(function(){ $(this).addClass( ...

  9. jQuery源码:从原理到实战

    jQuery源码:从原理到实战 jQuery选择器对象 $(".my-class"); document.querySelectorAll*".my-class" ...

  10. Javascript链式调用案例

    jQuery用的就是链式调用.像一条连接一样调用方法. 链式调用的核心就是return this;,每个方法都返回对象本身. 下面是简单的模拟jQuery的代码, <script> win ...

随机推荐

  1. Leaflet 调用腾讯瓦片地图服务demo

    <link rel="stylesheet" href="https://unpkg.com/leaflet@1.7.1/dist/leaflet.css" ...

  2. 把MyBatis当项目一样,讲透源码的技术书籍!

    作者:小傅哥 博客:https://bugstack.cn 沉淀.分享.成长,让自己和他人都能有所收获! 为啥?因为这些年,就很少有人能自主意识到,如何提升编码质量! 但讲屁话没有用,想学好编程突破阶 ...

  3. PostgreSQL数据库运行日志

    PostgreSQL运行日志可以实现日志输出记录,默认是没有启动记录.这个日志一般是记录服务器与DB的状态,比如各种Error信息,定位慢查询SQL,数据库的启动关闭信息,发生checkpoint过于 ...

  4. postgreSQL开启数据库guid类型

    执行:create extension "uuid-ossp"; 即可使用:SELECT gen_random_uuid();或SELECT uuid_generate_v4()

  5. Python (进阶 第二部)

    目录 函数 闭包 匿名函数 迭代器 高阶函数 推导式 递归函数 函数 函数的定义:  功能( 包括一部分代码,实现某种功能,达成某个目的) 函数的特点:  函数可以反复调用 ,提高代码的复用性,提高开 ...

  6. Anaconda 环境中安装OpenCV (cv2)

    1.使用Anaconda 的对应环境,查看环境中的Python版本号 (1)使用Anaconda 查看存在的环境:conda info --env (2)激活环境:conda activate XXX ...

  7. 【转载】Python(cx_oracle)的DPI-1047错误

    转自:https://blog.csdn.net/weixin_45158749/article/details/124800132 Python(cx_oracle)的DPI-1047错误 步步 F ...

  8. Too many requests in 1 hour. Try again later.的解决办法

    原因 你的梯子用的人太多了,openAI本身就有问答频率限制. 解决办法 换个相对独立,没那么多人用的梯子,找个"安静点"的地区.

  9. Matplotlib 实现画中画

    需要导入的包 inset_axes 要实现画中画,即在原画轴上添加新轴,需要用到mpl_toolkits.axes_grid1.inset_locator的inset_axes. 基本用法 new_a ...

  10. Codeforces 1132E(大数据多重背包)

    题目链接 题意 给定背包容量$w$,体积分别为$1$到$8$的物体的数量求不超过背包容量的最大体积 思路 考虑将答案转化成$840 * x + y$的形式其中$840 = lcm(1-8), y &l ...