实现封装jQuery对象方法的插件

2024-08-28

jQuery对象插件封装步骤

jQuery是js的一个非常优秀的库,它大大简化了js的很多操作,并且解决了js的大部分兼容性问题.甚至很多css兼容性问题,用jQuery写都能解决. 这里是对象插件的封装.当然,封装插件很多,这里是最简单的一种:1.打两个括号 ()()2.在第二个括号里面加入"jQuery" ()(jQuery) 3.在第一个括号里面写一个匿名函数,传参是一个$ (function($){})(jQuery) 4.在function($){}写:$.fn.插件名,如$.fn.tabs,这里的f

jquery------添加jQuery对象方法

my.js $(document).ready(function(){ (function($){ $.fn.swapClass=function(class1,class2){ if(this.hasClass(class1)){//第一个满足,第二个就不会执行 $elment.removeClass(class1).addClass(class2); } else if(thist.hasClass(class2)){ $elment.removeClass(class2).addClass

JQuery编写自己的插件（七）

一:jQuery插件的编写基础1.插件的种类编写插件的目的是给一系列已经方法或函数做一个封装,以便在其他地方重复使用,方便后期维护和提高开发效率.常见的种类有以下三种:封装对象方法的插件

《锋利的jQuery》笔记：插件的使用和写法

jQuery插件的种类 1.封装对象方法这种插件是将对象方法封装起来,用于对通过选择器获取的jQuery对象进行操作,是最常见的一种插件.此类插件可以发挥出jQuery选择器的强大优势,有相当一部分的jQuery的方法,都是在jQuery脚本库内部通过这种形式“插”在内核上的,例如parent()方法,appendTo()方法等. 2.封装全局函数可以将独立的函数加到jQuery命名空间下.如常用的jQuery.ajax()方法.去首尾空格的jQuery.trim()方法,都是jQuery内

【jQuery】结合accordion插件分析写插件的方法及注意事项

1.jQuery插件的命名方式:jquery.[插件名].js 2.对象方法附加在jQuery.fn上,全局函数附加在jQuery对象本身上 3.插件内部this指向的是通过选择器获取的jQuery对象 4.结尾加分号,插件头部最好也加分号 5.插件应该返回一个jQuery对象,保证插件的链式操作 6.插件内部应用完整的jQuery而不是$,但可以利用闭包,将jQuery传入,使插件内部可以继续使用$符合作为jQuery别名 7.闭包另一大好处:可以避免内部变量影响全局空间 :(function

jQuery笔记之工具方法extend插件扩展

jQuery工具方法 $.extend()插件扩展(工具方法) $.fn.extend()插件扩展(实例方法) 浅度克隆.深度克隆两个方法基本是一样的,唯一不同的就是调用方式不一样 ------------------------------------------------------------- $.extend()插件扩展(工具方法) 可以自己定义方法拿来使用我们定义的是可以自己传入相应的参数,然后返回出两个参数之间的随机数的方法 $. 自定义的方法名就可以使用 $.fn.exte

读<jQuery 权威指南>[5]-插件

一.说明 jQuery插件官网:http://plugins.jquery.com/ 使用插件时引用顺序:插件引用要位于主jquery库之后. 二.插件应用实例演示插件jquery.validate.js的使用方法: ①引用jQuery主库和validate插件. 注意: jQuery主库要先于插件引用: 如果想显示中文错误提示,还需要引用jquery.validate.messages_cn.js. <script type="text/javascript" src=&qu

jQuery第七章插件的编写和使用

1.本章目标编写jquery插件 2.插件也称为扩展,是一种按照一定的规范的应用程序接口编写出来的程序插件的目标是给已有的一系列函数做一个封装,以便在其他的地方复用,方便维护和开发效率 3.jquery插件的种类 1.封装对象方法的插件将对象方法封装起来,用于选择器获取的对象进行操作比如$("#myForm").attr('action','xxxServlet') 比如:jQuery.trim() 3.选择器插件扩展我们自己的选择器 4.jquery插件的编写 1.jqu

【转】简单的jQuery插件开发方法

在实际开发工作中,总会碰到像滚动,分页,日历等展示效果的业务需求,对于接触过jQuery以及熟悉jQuery使用的人来说,首先想到的肯定是寻找现有的jQuery插件来满足相应的展示需求.目前页面中常用的一些组件,都有多种jQuery插件可供选择,网络上也有很多专门收集jQuery插件的网站.利用jQuery插件确实可以给我们的开发工作带来便捷,但是如果只是会简单使用,而对其中的原理不甚了解,那么在使用过程中碰到问题或者对插件进行定制开发时就会有诸多疑惑.本文的目的就是可以快速了解jQuery插件

[转]jquery开发自定义的插件总结

本文转自:http://www.cnblogs.com/Jimmy009/archive/2013/01/17/jquery%E6%8F%92%E4%BB%B6.html 前几天在玩jquery,今天就把这几天的学习做一个总结. 首先jquery开发自定义的控件分两大类(我自己这么分的),第一就是不带参数的插件,还有一类就是带参数的jquery插件了. 先从简单的开始.首先我们要了解一下什么叫jquery,jquery是对js的一系列的分装,说白了他就是js的分装以后的产物.但是我们用jquer

jQuery 如何创建基本插件（翻译）

有时候,你希望有一块功能在整个代码当中都可以使用.例如,你可能想要有一个单一的方法可以在jQuery选择器上进行调用,用于处理该选择器上的一系列操作.又或许你编写了一个十分有用的工具函数,并希望能够简单的迁移到其它的项目当中.在这种情况下,你也许想要编写一个插件. jQuery工作原理101:jQuery对象方法和工具方法在我们编写插件前,首先需要对jQuery的工作原理有一些了解.看一下这段代码: $( "a" ).css( "color", "red

JQuery对象和DOM对象的区别与转换

刚开始学习JQuery,经常分不清楚哪些是JQuery对象,哪些是DOM对象,了解它们之间的关系是很有必要的. 1.DOM对象和JQuery对象的区别 1) DOM对象 DOM是Document Object Model,即文档对象模型的缩写.DOM是以层次结构组织的节点或信息片段的集合,每一份 DOM都可以表示成一个树. 如: <html> <head> <title>标题内容</title> </head> <body> <

把jQuery的类、插件封装成seajs的模块的方法

这篇文章主要介绍了把jQuery的类.插件封装成seajs的模块的方法,需要的朋友可以参考下注:本文使用的seajs版本是2.1.1 一.把Jquery封装成seajs的模块 define(function () { //这里放置jquery代码把你喜欢的jquery版本放进来就好了 return $.noConflict(); }); 调用方法: 这样引进就可以像以前一样使用jquery define(function (require, exports, module) { var $

使用DOM的方法获取所有li元素，然后使用jQuery()构造函数把它封装为jQuery对象

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <meta ht

封装jQuery插件的步骤

引语:jQuery提供了很多插件,我们在开发的过程使用插件能节省时间简化开发也避免从头开始编写每个组件,单我们除了懂得使用别人已编写好的插件以外,也到懂得如何封装属于我们自己的插件,以下就是封装jQuery插件的步骤,以放大镜效果为例. 附效果文件:下载 1.导入素材,已经封装成jQ版的放大镜 <!doctype html> <html> <head> <meta charset="utf-8"> <title>无标题文档&

认识JQuery，JQuery的优势、语法、多库冲突、JS原生对象和JQuery对象之间相互转换和DOM操作，常用的方法

(一)认识JQuery JQuery是一个JavaScript库,它通过封装原生的JavaScript函数得到一套定义好的方法 JQuery的主旨:以更少的代码,实现更多的功能 (二)JQuery的优势 1)可以像CSS一样访问和操作DOM 2)修改CSS控制页面外观 3)简化JS代码操作 4)事件代理更加容易 5)动画效果使用方便 6) Ajax技术更加完美 7)大量的基于Jquery的插件 8)可以自定义扩展功能插件 (三)JQuery的语法格式:$(selector).actio

为Jquery类和Jquery对象扩展方法

转:https://www.cnblogs.com/keyi/p/6089901.html jQuery为开发插件提拱了两个方法,分别是: JavaScript代码 jQuery.fn.extend(object); jQuery.extend(object); jQuery.extend(object); 为扩展jQuery类本身.为类添加新的方法. jQuery.fn.extend(object);给jQuery对象添加方法. fn 是什么东西呢.查看jQuery代码,就不难发现. Java

jQuary总结11:jQuery插件封装---jQuery封装手风琴动画插件

完整代码下载点击我的GitHub: https://github.com/XingJYGo/jquery-accordion 1 手风琴的效果展示如下: 2 封装插件目录结构如下: 主要包括:HTML结构, CCS样式,JS文件以及jquary库. 3 插件封装步骤如下: 3-1首先,编写HTML静态结构: <div id="box"> <ul> <li></li> <li></li> <li><

详细图解jQuery对象，以及如何扩展jQuery插件

详细图解jQuery对象,以及如何扩展jQuery插件早几年学习前端,大家都非常热衷于研究jQuery源码.我还记得当初从jQuery源码中学到一星半点应用技巧的时候常会有一种发自内心的惊叹,“原来JavaScript居然可以这样用!” 虽然随着前端的发展,另外几种前端框架的崛起,jQuery慢慢变得不再是必须.因此大家对于jQuery的热情低了很多.但是许多从jQuery中学到的技巧用在实际开发中仍然非常好用.简单的了解它也有助于我们更加深入的理解JavaScript. 这篇文章的主要目的就

jQuery命名空间和自定义插件的的多种方法

jQuery插件的开发包括两种: 一种是类级别的插件开发,即给jquery添加新的全局函数,相当于给jQuery类本身添加方法.jQuery的全局函数就是属于jQuery命名空间的函数,另一种是对象级别的插件开发,即给jQuery对象添加方法.下面就两种函数的开发做详细的说明. 1.类级别的插件开发类级别的插件开发最直接的理解就是给jQuery类添加类方法,可以理解为添加静态方法.典型的例子就是$.AJAX()这个函数,将函数定义于jQuery的命名空间中.关于类级别的插件开发可以采用如下几种

自己动手开发jQuery插件全面解析 jquery插件开发方法

jQuery插件的开发包括两种: 一种是类级别的插件开发,即给jQuery添加新的全局函数,相当于给jQuery类本身添加方法.jQuery的全局函数就是属于jQuery命名空间的函数,另一种是对象级别的插件开发,即给jQuery对象添加方法.下面就两种函数的开发做详细的说明. 1.类级别的插件开发类级别的插件开发最直接的理解就是给jQuery类添加类方法,可以理解为添加静态方法.典型的例子就是$.AJAX()这个函数,将函数定义于jQuery的命名空间中.关于类级别的插件开发可以采用如下几种

实现封装jQuery对象方法的插件

热门专题