jquery06 jQuery.extend 给jQuery函数添加、继承 静态方法-阿里云开发者社区

开发者社区> 开发与运维> 正文
登录阅读全文

jquery06 jQuery.extend 给jQuery函数添加、继承 静态方法

简介:
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<script>
jQuery.extend({//给jQuery函数添加的静态方法
    
    expando  :  生成唯一JQ字符串(内部)
    noConflict()  :  防止冲突
    isReady  :  DOM是否加载完(内部)
    readyWait  :  等待多少文件的计数器(内部)
    holdReady()  :  推迟DOM触发
    ready()  :  准备DOM触发
    isFunction()  :  是否为函数
    isArray()  :  是否为数组
    isWindow()  :  是否为window
    isNumeric()  :  是否为数字 
    type()  :  判断数据类型
    isPlainObject()  :  是否为对象自变量
    isEmptyObject()  :  是否为空的对象
    error()  :  抛出异常
    parseHTML()  :  解析节点
    parseJSON()  :  解析JSON
    parseXML()  :  解析XML
    noop()  :  空函数
    globalEval()  :  全局解析JS
    camelCase()  :  转驼峰(内部)
    nodeName()  :  是否为指定节点名(内部)
    each()  :  遍历集合
    trim()  :  去前后空格
    makeArray()  :  类数组转真数组
    inArray()  :  数组版indexOf
    merge()  :  合并数组
    grep()  :  过滤新数组
    map()  :  映射新数组
    guid  :  唯一标识符(内部)
    proxy()  :  改this指向
    access()  :  多功能值操作(内部)
    now()  :  当前时间
    swap()  :  CSS交换(内部)
    
});

jQuery.ready.promise = function(){};  监测DOM的异步操作(内部)

function isArraylike(){}  类似数组的判断(内部)
</script>
</head>

<body>
</body>
</html>
复制代码
复制代码
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<script>

var $ = 123;
var jQuery = 456;
js源码里面有    _jQuery = window.jQuery,_$ = window.$,此时_$ = 123,_jQuery=456
</script>
<script src="jquery-203.js"></script>
<script>

alert( $.expando );//jQuery20308751509357000222
---------------------------------------------------------------------------------
//$()  jQuery()  这2个是jQuery对外提供的接口,其他的库也有$,
var miaov = $.noConflict(true);//miaov就当$来用了
var $ = 123;//要写到下面,写到上面$已经是123,就不能调用noConflict方法了,
miaov(function(){//$(function(){})
    alert($);
    alert( jQuery );
});
---------------------------------------------------------------------------------
$(function(){});//等dom(标签)加载完就走,<img>标签是先加载标签然后加载图片资源,这个方法等标签dom加载完就走,先于window.onload。dom加载完会触发原生的DOMContentLoaded事件。
/*$(function(){})在init方法中调用的是rootjQuery.ready(function(){})就是$(document).ready(function(){})就是$().ready(function(){})(不同于$.ready(),前者是实例的方法,后者是类的静态方法,方法的实现不一样),
ready: function( fn ) {
    jQuery.ready.promise().done( fn );
    return this;
},
jQuery.ready.promise()创建了一个延迟对象,等到时机执行fn函数,异步操作,
jQuery.ready.promise()最终都是调的$.ready(),
$.ready()最终走readyList.resolveWith( document, [ jQuery ] );然后触发函数fn执行。
*/

window.onload = function(){//等页面中所有东西都加载完,才走这里
};

-----------------------------------------------------------------------

$(function( arg ){
    alert(arg);//jQuery函数
});


$(document).ready(function(){
});

$(document).on('ready',function(){
    alert(123);
});
------------------------------------------------------------------
$.holdReady(true);//推迟
$(function(  ){
    alert(123);//不弹出来
});
$.holdReady(true);//释放推迟
---------------------------------------------------------------------
readyList.resolve();


---------------------------------------------------------------------

$.getScript('a.js',function(){//动态加载js,异步加载,有可能alert(2)先于a.js加载完
});
$(function(){
    alert(2);
});
--------------------------------------------------------------------------
$.holdReady(true);
$.getScript('a.js',function(){//动态加载js,异步加载
    $.holdReady(false);//a.js加载完后回调函数执行,释放hold,保证先加载a.js,然后弹出alert(2)
});
$(function(){
    alert(2);
});
----------------------------------------------------------------------
$.holdReady(true);

$.getScript('b.js',function(){
    $.holdReady(false);
});

$.holdReady(true);

$.getScript('c.js',function(){
    $.holdReady(false);
});

---------------------------------------------------------------------

</script>
</head>

<body>
<div>aaaaa</div>
<img src="">
</body>
</html>
复制代码
复制代码
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<script src="jquery-2.0.3.js"></script>
<script>

function show(){
}
alert( $.isFunction([]) );
alert( typeof alert );//低版本是object,高版本是function

alert( isFunction(alert) );
function isFunction(fn){ //jquery提供的兼容方法
       
        if( !fn )
            return false;
        var s   = "toString",
            v   = "valueOf",
            t   = typeof fn[s] === "function" && fn[s],
            o   = typeof fn[v] === "function" && fn[v],
            r;
        if( t )
            delete fn[s];
        if( o )
            delete fn[v];
        r   = typeof fn !== "string" && !(fn instanceof String) && !fn.nodeName && fn.constructor != Array && /^[\s[]?function/.test(fn + "");
        if( t )
            fn[s]   = t;
        if( o )
            fn[v]   = o;
        return r;
        
}


alert( Array.isArray([]) );

alert( $.isWindow(window) );

alert( null == null );//true
alert(undefined == null);//true

var a = 10;
window.a = 10;

window.open();//window是浏览器窗口

alert( typeof NaN );//number

alert( $.isNumeric(123) );

alert( isFinite( Number.MAX_VALUE + Number.MAX_VALUE ) );


var a = new Date;
alert( typeof a );//原生typeof对于复杂类型都是object,
alert( $.type(a) );//时间:Date,数组:array,'ss':string,{}:object,null:null


alert( {}.toString.call([]));//[object Array]
alert( {}.toString.call([]) =='[object Array]' );
alert( {}.toString.call(new Date) );//
alert( {}.toString.call(111) );//[object Number]
alert( {}.toString.call('111') );//[object String]
alert( $.type(undefined) );  //'undefined'
alert( {}.toString.call(function f(){}) );//[object Function]
alert( $.type([]) );  //'[object Array]' -> array

</script>
</head>

<body>
</body>
</html>
复制代码

 


本文转自农夫山泉别墅博客园博客,原文链接:http://www.cnblogs.com/yaowen/p/6906731.html,如需转载请自行联系原作者

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

分享:
开发与运维
使用钉钉扫一扫加入圈子
+ 订阅

集结各类场景实战经验,助你开发运维畅行无忧

其他文章
最新文章
相关文章