$.fn.extend扩展的是一个jQuery对象函数,$.extend扩展的是一个jQuery全局函数

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="../../resources/js/jquery-2.0.0.js"></script>
<script type="text/javascript" src="../../resources/customjs/regexp.js"></script>
</head>
<body>
<input id="time" type="button" name="time" value="输入日期" /><br/>
<input id="addData" name="" type="button" value="添加数据"/>
</body>
<script type="text/javascript">
$("#time").click(function(){
    var inputDate = prompt("请输入日期:");
    var flag = Validate.validateDate(inputDate);
    console.log(flag);
});

$("#addData").click(function(){
    //$.fn.extend jQuery对象函数
    $(this).inputDataToHtml();
    }
);
//jQuery全局函数
$.inputDataAsTitle();

</script>
</html>

regexp.js

var Validate = {
    //验证格式为yyyy-MM-dd的日期
    validateDate : function(inputDate){
        ,})(-|\/)(\d{,})\(\d{,})$/);
        if(r==null)
            return false;
        ], r[]-, r[]);
        ]&&(d.getMonth()+)==r[]&&d.getDate()==r[]);
    }
}

$.fn.extend({
    inputDataToHtml : function(){
        var data = prompt("请输入数据:");
        &&$(){
            $(this).after("<div id='list'></div>");
            $("#list").append("<ol></ol>");
        }
        $("#list ol").append("<li>"+data+"</li>");
    }
})

$.extend({
    inputDataAsTitle : function(){
        var data = prompt("请输入标题:");
        $("body").append("<h1>标题为 : <font color='green'>"+data+"</font><h1>");
    }
});

js的extend和fn.extend使用的更多相关文章

  1. jQuery extend() & jQuery.fn.extend(),插件编写

    资料来源:网上资料整理并自行改编测试.复制以下代码并依赖jquery.js,jquery.validate.js即可执行.有误之处,请@我啊,敬请赐教. <!DOCTYPE html PUBLI ...

  2. jQuery.fn和jQuery.prototype jquery.extend() jquery.fn.extend()区别介绍

    这里的 jQuery , jQuery.fn , jQuery,fn,init ,jQuery,prototype 都代表什么. 来看下jQuery的源码是怎么样定义的: (function( win ...

  3. jQuery中,$.extend,$obj.extend和$.fn.extend三者的区别

    jQuery中,$.extend,$obj.extend和$.fn.extend三者的区别 现在做的一个项目,所使用的框架是基于jQuery扩展的,于是平时学了一下jQuery,了解到了它的扩展函数: ...

  4. 理解jQuery的$.extend与$.fn.extend

    https://www.cnblogs.com/xuxiuyu/p/5989743.html 上面这篇博客总结的很棒!!,以下对自己的认识做一个总结 <!DOCTYPE html> < ...

  5. $.extend与$.fn.extend()

    很多情况下,用户需要对jQuery插件进行二次开发,那么我们来看看JQ原开发者为我们提供的两种扩展插件的方式如下: 1.类别类:相当于为jquery扩展一个类,比如现在我要扩展一个简单的想加的功能函数 ...

  6. $.extend()与$.fn.extend()

    jQuery.extend(object) 扩展jQuery对象本身.用来在jQuery命名空间上增加新函数.jQuery.fn.extend(object) 扩展 jQuery 元素集来提供新的方法 ...

  7. $.extend()和$.fn.extend()用法和区别

    $.extend()和$.fn.extend()用法和区别: 在自己制作插件的时候会经常用到$.extend()和$.fn.extend()两个函数,无论从外观还是作用都非常的类似,但是实际上它们的区 ...

  8. $.extend(),与$.fn.extend() 讲解

    $.extend(),与$.fn.extend() 讲解(一) (2013-07-11 10:24:31) 转载▼ 转自:http://blog.sina.com.cn/s/blog_a3bd3bd0 ...

  9. 插件的理解$.extend()与$.fn.extend()

    插件的理解.$.extend()与$.fn.extend()    插件开发包括两种:1.类级别的插件开发,即$.extend()扩展jquery对象本身:2.对象级别的插件开发,即$.fn.exte ...

  10. jQuery开发自定义插件 $.extend()与$.fn.extend()

    jQuery extend()和jQuery.fn.extend() jQuery提供两个用于封装扩展的方法: 1.$.extend(); 扩展jQuery类方法,即jQuery全局方法 (在全局可直 ...

随机推荐

  1. css精灵动画

    精灵动画的实现 CSS Sprites在国内很多人叫CSS精灵,其实这个技术不新鲜,原理就是:靠不断的切换图片让人感觉视觉上不断在变化,例如gif动画之类的效果 那么前端如何实现精灵效果? 传统的就是 ...

  2. MVC3实现多个按钮提交

    有时我们需要在同一个Form表单中进行多个按钮的提交,来完成不同的功能.因为MVC中一个表单默认只能提交到一个Action处理,相对比较麻烦. 1.使用客户端脚本 我们可以view中加上如下代码: & ...

  3. hdu1059 多重背包(转换为01背包二进制优化)

    题目链接:http://acm.split.hdu.edu.cn/showproblem.php?pid=1059 之前写过一个多重背包二进制优化的博客,不懂请参考:http://www.cnblog ...

  4. Codeforces Round #355 (Div. 2)-A

    A. Vanya and Fence 题目连接:http://codeforces.com/contest/677/problem/A Vanya and his friends are walkin ...

  5. spring4 mvc 出错

    java.lang.IncompatibleClassChangeError: class org.springframework.core.type.classreading.ClassMetada ...

  6. javaScript封装的各种写法

    在javascript的世界里,写法是个神奇的现象,真是百家齐开放啊!每次看到老外写的js组件,思想和写法都怪异,就没看到一个js结构基本相同的代码出来.今天,我就来谈谈js写法,我在开发过程中,也写 ...

  7. C#解决从含身份证号码的Excel表格导入数据库的问题

    用C#做从Excel表导入SQL数据库时发现从EXCEL导入的身份证号码会变成科学表示方法. 解决这个问题是比较容易的,首先,打开电子表格,选中“身份证号码”一列,右键选择“设置单元格格式”,进入单元 ...

  8. soapui中文操作手册(七)----Web Service Sample Project

    REST推理 这份简短的教程将引导您完成架构推断功能. 我们将创建一个新的项目,并添加一个REST服务,而初始WADL文件启动了. 发送请求后,我们就可以使用响应来构建我们的架构. 演示请求 为了演示 ...

  9. ccc 模拟重力 正太分布

    ball.js cc.Class({ extends: cc.Component, properties: { x_vel:{ default:0 }, y_vel:{ default:0 }, gr ...

  10. BZOJ 2049 & LCT又一模板

    题意: 自己看...加边删边问联通... SOL: 就加了一个findroot而已... 然而时间还是惨不忍睹...优化全开也才1700ms...膜seter... Code: /*========= ...