zoukankan      html  css  js  c++  java
  • 老生长谈的$.extend()方法

    jq的extend()是jq插件扩展很重要的部分,到这里证明是可以自己在jq的基础上,分为两种方法去扩展或开发,为jq本身添加一个方法,可以理解成扩展静态方法和自定义方法。

    今天有看到一篇帖子,对这部分的理解十分独到,特意来分享一下。

    首先:$.extend({})

    用这个方法给jquery本身增加一个hello的方法;

    <script type="text/javascript">
    $(document).ready(function (){
        $.extend({
        hello:function(){alert("hello world!")},
        });
        $("p").click(function(){
            $.hello();
        })
        })
    </script>

    ps:给jquery新建了一个$.hello(),然后绑定给p元素一个点击事件,点击p元素就可以弹出对话框,hello world! 这只是一个简单的例子还可以去定义更多的静态方法给jquery。

    其次:$.fn.extend({})

    用这个方法给jquery对象添加一个新的方法;

    <script type="text/javascript">
    $(document).ready(function (){
        $.fn.change = function(){
            $(this).css("background","red");
            };
        $("p").click(function (){
            $(this).change();
            })
        })
    </script>

    ps:首先用$.fn.extend({}),添加一个新的名为change()方法,然后还是给P元素绑定一个新的方法,$(this).change(),单击p元素是背景颜色会变成红色。

    可以简单的对比一下,这两种方法的区别到底在哪里:

    • 第一种$.extend()方法,使用时需要带着jq的标注$.hello();而$.fn.extend()方法使用时绑定在对象上$(this).change();
    • 第一种方法是扩展一个jq方法,第二种是为jq对象扩展一个方法;
    • 可以把第一种方式看成jq的合并数组的工具函数,第二种可以是一种操作方法,类似dom操作的一些方法也可传递参数;
  • 相关阅读:
    使用通配符查询
    使用聚合函数查询
    有趣的图标
    利用Office Chart 制作柱图(一个柱子)
    众多select
    对象不能从 DBNull 转换为其他类型。
    使用谓词进行查询
    使用数学函数查询
    学生信息表 通过选择年级和班级得到详细的学生信息名单
    使用时间函数查询
  • 原文地址:https://www.cnblogs.com/jqstudy/p/6188857.html
Copyright © 2011-2022 走看看