如何制作自己的Jquery插件,内容参考学习了网上的讲解,如下

使用这两个方法

  • jQuery.fn.extend(object)
  • jQuery.extend(object)

jQuery.extend(object):

  扩展jQuery对象本身。添加一个加法方法."相当于静态方法"

  $.extend(add:function(a,b){return a+b}) // 方法名叫add 接收参数a和b,返回a+b的值

  let sum = $.add(5+8); // 13

jQuery.fn.extend(object):

  扩展jq对象的方法.fn指向的是$.prototype,就是$这个函数的原型对象."相当于实例方法"

  $.fn.extend(innerHTML: function(){return $(this).html()}) // 返回dom对象的内含文本,方法名是innerHTML.

  let innerhtml = $('<h2>mirror.tom</h2>').innerHTML(); // mirror.tom

第1个方法,可以扩展工具函数,与具体对象无关的

第2个方法,可以做插件,比如在一个DIV上加载轮播图片.调用起来很是熟悉

$.fn.extend(slider:function(){...})

$('#imgbox').slider()

jquery扩展写法的更多相关文章

  1. Jquery插件写法及extentd函数

    JQuery插件写法 JQuery插件又分为类扩展方法和对象扩展方法两种,类插件是定义在JQuery命令空间的全局函数,直接通过可调用,如可调用,如可调用,如.ajax():对象插件是扩展JQuery ...

  2. jQuery 插件写法2

    转载:http://www.xuanfengge.com/jquery-plug-in-written-summary-and-summary-of-writing-object-oriented-m ...

  3. jQuery 插件写法

    一.jQuery插件的类型 1. jQuery方法 很大一部分的jQuery插件都是这种类型,由于此类插件是将对象方法封装起来,在jQuery选择器获取jQuery对象过程中进行操作,从而发挥jQue ...

  4. jquery扩展鼠标mousewheel事件

    最近项目中要有个鼠标在图片上滚动实现图片放大和缩小的得到功能,隐约的记得好像记得有个 mousewheel 事件,可以实现需求,于是乎,开始在网上查找这一方法,但是,出乎意料的结果,各浏览器对此方法有 ...

  5. [转]jQuery插件写法总结以及面向对象方式写法

    本文转自:http://www.xuanfengge.com/jquery-plug-in-written-summary-and-summary-of-writing-object-oriented ...

  6. Python之Web前端jQuery扩展

    Python之Web前端: 一. jQuery表单验证 二. jQuery扩展 三. 滚动菜单 一. jQuery表单验证: 任何可以交互的站点都有输入表单,只要有可能,就应该对用户输入的数据进行验证 ...

  7. 26、ASP.NET MVC入门到精通——后台管理区域及分离、Js压缩、css、jquery扩展

    本系列目录:ASP.NET MVC4入门到精通系列目录汇总 有好一段时间没更新博文了,最近在忙两件事:1.看书,学习中...2.为公司年会节目做准备,由于许久没有练习双截棍了,难免生疏,所以现在临时抱 ...

  8. jquery插件写法

    //传统写法 //全局方法 ;(function($){ $.method = function(){ } //or $.obj = { method1:function(){}, method2:f ...

  9. 使用jquery获取url及url参数的方法及定义JQuery扩展方法

    1.jquery获取url很简单,代码如下: window.location.href; 其实只是用到了javascript的基础的window对象,并没有用jquery的知识. 2.jquery获取 ...

随机推荐

  1. react 路由 react-router-dom

    import React from 'react'; import DataList from './data' import Tr from './Tr' // import One from '. ...

  2. react初入门

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. css太极

    自己用css做的太极,留个纪念. 用css做太极有很多种实现方法,我这种大概是最简单的了吧,因为div用得太多了,哈哈. 高级一点的应该是用伪类:before和:after去减少div的用量(手动滑稽 ...

  4. Composer对于第三方包的自动加载

    Composer提供了四种方式的支持,分别是 PSR-0和PSR-4的自动加载(我的一篇文章也有介绍过它们),生成class-map,和直接包含files的方式. PSR-4是composer推荐使用 ...

  5. Angular 过滤器

    <!DOCTYPE html><html ng-app="myApp"><head lang="en"> <meta ...

  6. AngularJS 中的 factory、 service 和 provider区别,简单易懂

    转自:http://blog.csdn.net/ywl570717586/article/details/51306176 初学 AngularJS 时, 肯定会对其提供 factory . serv ...

  7. springboot No Identifier specified for entity的解决办法

    今天在做一个项目的时候遇到一个问题,实体类忘了指定主键id,然后报如下错误,也是自己粗心大意造成的,在此记录下. java.lang.IllegalStateException: Failed to ...

  8. MCV 和 MTV框架基本信息

    一 . MCV # web服务器开发最著名的MVC模式 M : model.py 就是和数据库打交道的, 创建表等操作 V : view 视图(视图函数,就是装HTML文件的) C : control ...

  9. git(命令行常用炒作)

    Git常用操作 https://backlog.com/git-tutorial/cn/intro/intro1_1.html Git详解(思维导图) https://blog.csdn.net/hu ...

  10. dede:field name=’position’标签调用 主页改成英文Home和改变符号

    在用dede:field name=’position’ 这个标签的时候我们调用的这个就是中文的,出现的是主页>+相应的栏目  ,那么这个问题怎么改成英文的呢?有好多大虾都说找到dede安装目录 ...