首页
学习
活动
专区
圈层
工具
发布
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    终于有人对 jQuery下手了,一键移除项目对它的依赖

    replace-jquery 工具试着移除一下 main.js 中的jquery代码 先全局下载一下 npm install -g replace-jquery 然后在项目目录使用,语法为replace-jquery...方法替换成了简单的原生方法,并封装在Utils这个类中,那么我们每次调用$("xxx")时,其实就是在调用该类上的方法,那么对这个文件做一些修改 // 此处删除export class Utils {...) { return new Utils(selector); } 这样就相当于我们在全局模拟jquery定义了一个$方法。...此时html文件中的jquery引用就可以删除了,并把我们刚才生成的文件引进来 再去页面中尝试操作dom,可以看到效果跟之前一样,成功!...将代码混淆丑化以后大概只有10kb 因为这个工具刚发布才2个星期不到,只实现了大部分的jquery代码替换,比如ajax暂时是没办法替换的,你如果尝试去替换,工具也会提醒你 总的来说,这个工具想法不错

    74120

    终于有人对 jQuery下手了,一键移除项目对它的依赖

    replace-jquery 工具试着移除一下 main.js 中的jquery代码 先全局下载一下 npm install -g replace-jquery 然后在项目目录使用,语法为replace-jquery...方法替换成了简单的原生方法,并封装在Utils这个类中,那么我们每次调用$("xxx")时,其实就是在调用该类上的方法,那么对这个文件做一些修改 // 此处删除export class Utils {...) { return new Utils(selector); } 这样就相当于我们在全局模拟jquery定义了一个$方法。...此时html文件中的jquery引用就可以删除了,并把我们刚才生成的文件引进来 再去页面中尝试操作dom,可以看到效果跟之前一样,成功!...将代码混淆丑化以后大概只有10kb 因为这个工具刚发布才2个星期不到,只实现了大部分的jquery代码替换,比如ajax暂时是没办法替换的,你如果尝试去替换,工具也会提醒你 总的来说,这个工具想法不错

    65520

    jQuery 基本语法

    each(fn) 说明:将函数作用于所有匹配的对象上 参数:fn (Function): 需要执行的函数 例子: 未执行jQuery前: <img src="1.jpg...()) } 运行:当点击id为test的元素时,alert对话框显示:So is this,即第二个标签的内容 get(num) 说明:获取匹配元素,get(num)返回匹配元素中的某一个元素 参数...(obj, fn) obj为对象或数组,fn为在obj上依次执行的函数,注意区分$().each() $.each( [0,1,2], function(i){ alert( "Item #" + i...$.getScript(url, callback)  用get方式载入并运行一个远程javascript文件。请求完成后处理函数callback。...loadIfModified(url, params, callback)  用get方式向远程页面传递参数,从最后一次请求后如果数据有变化才作出响应,将返回结果载入页面DOM中,并执行函数callback

    4.8K40

    第73天:jQuery基本动画总结

    如果clearQueue参数提供true值,那么在队列中的动画其余被删除并永远不会运行 - .stop(true,true); 当前动画将停止,但该元素上的 CSS 属性会被立刻修改成动画的目标值 简单的说...中each方法的应用 jQuery中有个很重要的核心方法each,大部分jQuery方法在内部都会调用each,其主要的原因的就是jQuery的实例是一个元素合集 如下:找到所有的div,并且都设置样式...与this的引用相同 jQuery.each()函数还会根据每次调用函数callback的返回值来决定后续动作。...中查找数组中的索引inArray 在PHP有in_array()判断某个元素是否存在数组中,JavaScript却没有,但是jQuery封装了inArray()函数判断元素是否存在数组中。...中DOM元素的获取index方法 get方法是通过已知的索引在合集中找到对应的元素。

    4.6K10

    十三、jQuery过时的今天,你还会使用它吗

    this; }, // 在原型上添加一堆方法 toArray: function () { }, get: function () { }, each: function...2 对象封装分析 在上面的实现中,首先在jQuery构造函数里声明了一个fn属性,并将其指向了原型jQuery.prototype。然后在原型中添加了init方法。...其实在上一篇文章中,关于封装一个对象,我跟大家分享了一个非常非常干,但是却只有少数几个读者大佬get到的知识,那就是在封装对象时,属性和方法可以具体放置的三个位置,并且对于这三个位置的不同做了一个详细的解读...在实现jQuery扩展方法时,一部分方法需要扩展到构造函数中,一部分方法需要扩展到原型中,当我们通读jQuery源码时,还发现有一些方法放在了模块作用域中,至于为什么会有这样的区别,建议大家回过头去读读前一篇文章...在实际开发中,我们运用得非常多的一个工具库就是lodash.js,大家如果时间充裕一定要去学习一下他的使用。 $.ajax() $.isFunction() $.each() ... ...

    1.7K20

    全网最新、最全的jQuery核心知识,你真的不想点开看看嘛?

    对象数组中所有 DOM 对象在浏览器中显示起来 13.2.3 remove函数 $(选择器).remove() : 将jQuery对象数组中所有 DOM 对象及其子对象一并删除 13.2.4 empty...13.2.7 each函数(常用) each 是对数组、json对象 和 dom 对象等的遍历,对每个元素调用一次函数。...~4,当执行完4的时候,会停止调用each()函数。)...$.get()与$.post()他们在内部都是调用的$.ajax() 15.2 $.ajax() 函数 (实现Ajax请求的核心函数) $.ajax() 是 jQuery 中 AJAX 请求的核心方法,...注意:如果这这里使用的是.post()函数,在服务端要使用doPost方法 给浏览器返回数据,所以此时应该将服务端的代码写入到 doPost方法体中 如果是 .get()写到doGet中.post()写到

    7.9K10

    06-老马jQuery教程-jQuery高级

    1.jQuery原型对象解密 jQuery里面的大部分API都是在jQuery的原型对象上定义的。jQuery源码中对原型对象做了简写的处理。...而且,在每次执行函数时,都会给函数传递一个表示作为执行环境的元素在匹配的元素集合中所处位置的数字值作为参数(从零开始的整型)。...i是当前dom对象在选择器返回数组中的索引。 }); 1.2 获取元素的个数 两种方法可以获取选择器匹配的元素的个数。...()); }); 2.jQuery构造函数解密 2.1 构造函数的each方法 语法:jQuery.each(object, [callback]) 概述 通用例遍方法,可用于例遍对象和数组...实际中此函数在 jQuery 中将自动使用而无需特意转换。 参数: obj:类型Object,类数组对象。 示例 // 过滤数组中小于 0 的元素。

    2.3K00

    jQuery对象访问

    参数说明 参数 说明 callback 对于每个匹配的元素所要执行的函数 selector 一个选择器,代表一个jQuery对象,将会从这个对象中查找元素 element 获得 index...可以是 DOM 元素或 jQuery 选择器 [index] 取得第 index 个位置上的元素 方法 概述 each(callback) 以每一个匹配的元素作为上下文来执行一个函数...($("li:first").index()); each(callback)——以每一个匹配的元素作为上下文来执行一个函数。...)); //1,传递一个jQuery对象 $('li').index($('li:gt(0)')); //1,传递一组jQuery对象,返回这个对象中第一个元素在原先集合中的索引位置 $('#bar')....index('li'); //1,传递一个选择器,返回#bar在所有li中的索引位置 $('#bar').index(); //1,不传递参数,返回这个元素在同辈中的索引位置。

    1.6K40

    06-老马jQuery教程-jQuery高级

    1.jQuery原型对象解密 jQuery里面的大部分API都是在jQuery的原型对象上定义的。jQuery源码中对原型对象做了简写的处理。...而且,在每次执行函数时,都会给函数传递一个表示作为执行环境的元素在匹配的元素集合中所处位置的数字值作为参数(从零开始的整型)。...i是当前dom对象在选择器返回数组中的索引。 }); 1.2 获取元素的个数 两种方法可以获取选择器匹配的元素的个数。...�2.jQuery构造函数解密 2.1 构造函数的each方法 语法:jQuery.each(object, [callback]) 概述 通用例遍方法,可用于例遍对象和数组。...实际中此函数在 jQuery 中将自动使用而无需特意转换。 参数: obj:类型Object,类数组对象。 示例 // 过滤数组中小于 0 的元素。

    2.7K90

    jQuery原理(原型上的属性、方法)

    [].slice.call(this); }, get 取指定下标的元素,获取的是原生DOM get: function (num) { if (arguments.length === 0...(num)); } }, first与last first:获取实例中的第一个元素,是jQuery类型的实例对象 first: function () { return this.eq...(0); }, last:获取实例中的最后一个元素,是jQuery类型的实例对象 last: function () { return this.eq(-1); }, each 遍历实例,把遍历到的数据传给回调使用...jQuery存在两个each方法,一个类方法,一个对象方法。...map方法与each方法的区别 each静态方法默认的返回值就是, 遍历谁就返回谁; map静态方法默认的返回值是一个空数组 each静态方法不支持在回调函数中对遍历的数组进行处理;map静态方法可以在回调函数中通过

    1.3K20

    JQuery最全常用方法指南

    在每个页面中可以 有很多个函数被加载执行,按照fn的顺序来执行。 bind(type, [data], fn) 为每一个匹配元素的特定事件(像click)绑定一个或多个事件处理器函数。...在每个对 象上,这个事件处理函数只会被执行一次。其他规则与bind()函数相同。 trigger(type, [data]) 在每一个匹配的元素上触发某类事件。...有如下两种方法: $("div").eq(2).html(); //调用jquery对象的方法 $("div").get(2).innerHTML; //调用dom的方法属性 4、同一函数实现set和...get Jquery中的很多方法都是如此,主要包括如下几个: $("#msg").html(); //返回id为msg的元素节点的html内容。...$.each(obj, fn):通用的迭代函数。可用于近似地迭代对象和数组(代替循环)。

    13.2K31

    jquery对象和dom对象的相互转换

    如:$("#msg")[0],$("div").eq(1)[0],$("div").get()[1],$("td")[5]这些都是dom对象,可 以使用dom中的方法,但不能再使用Jquery的方法。...有如下两种方法: $("div").eq(2).html();     //调用jquery对象的方法 $("div").get(2).innerHTML;   //调用dom的方法属性 4、同一函数实现...set和get   Jquery中的很多方法都是如此,主要包括如下几个: $("#msg").html();     //返回id为msg的元素节点的html内容。...已经为我们提供了各种事件处理方法,我们无需在html元素上直接写事件,而可以直接为通过jquery获取的对象添加事件。...$.each(obj, fn):通用的迭代函数。可用于近似地迭代对象和数组 (代替循环)。

    4.5K40
    领券