zoukankan      html  css  js  c++  java
  • jQuery.fn.extend()

    jQuery.fn.extend()

    extend()方法是定义在jQuery构造函数的prototype对象上面的一个方法,这样做就能使得所有jQuery对象的实例都能共享这个方法。jQuery构造函数的prototype对象可以被简写成jQuery.fn对象。jQuery.fn.extend()方法继承了jQuery原型($.fn)对象。

    实例:添加两个方法到jQuery原型($.fn),并且使用他们。

    <!doctype html>
    <html lang="en">
    <head>
      <meta charset="utf-8">
      <title>jQuery.fn.extend demo</title>
      <style>
    label { display: block; margin: .5em; }
         </style>
      <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
    </head>
    <body>
     
    <label><input type="checkbox" name="foo"> Foo</label>
    <label><input type="checkbox" name="bar"> Bar</label>
     
    <script>
    
    //第一种写法:
    jQuery.fn.extend({
      check: function() {
      //对 jQuery 对象进行迭代,为每个匹配元素执行函数,实现选中复选框功能。
        return this.each(function() { this.checked = true; });
      },
      uncheck: function() {
        return this.each(function() { this.checked = false; });
      }
    });
     
    
    //使用新创建的.check()方法
    $( "input[type='checkbox']" ).check();
    </script>
     
    </body>
    </html>
    

    jQuery.fn.extend()与jQuery extend()对比

    jQuery.extend()是对jQuery对象的扩展,可以理解为静态方法,是全局的,不需要实例jQuery就可以使用。

    jQuery.fn.extend()jQuery实例对象的方法,可以理解为普通方法。定义插件时需要返回this,以支持jQuery的链式操作。该方法可以被所有实例共享,所以jQuery实例对象才可以使用。

    参考:

  • 相关阅读:
    连接过滤器
    插件使用 之 Bmap
    插件使用 之 ztree、nicescroll
    插件使用 之 layui、echart
    插件使用 之 bootstrap
    jquery显隐特效 动画 事件
    jquery js对比 加载 操作内容 属性 样式 元素 选择器
    js三级联动练习(地址填写)
    js时间、定时器、移动div块、轮播
    js DOM操作
  • 原文地址:https://www.cnblogs.com/YeChing/p/6399949.html
Copyright © 2011-2022 走看看