jQuery扩展工具方法

共享学习Jquery源码的一些东西

jQuery.extend({

 

expando  :  生成唯一JQ字符串(内部)

noConflict()  :  防止冲突

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

isReady  :  DOM是否加载完(内部)

        $(function(){});

        rootjQuery.ready();=>$(doucment).ready(function(){});=>$().ready();=>jQuery.ready.promise().done(fn);//延迟对象==>$.ready();

        DOMContentLoaded

        window.onload=function(){};

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

readyWait  :  等待多少文件的计数器(内部)

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

holdReady()  :  推迟DOM触发

            a.js={<script>alert(1)</script>}

$.holdReady(true);

$.getScript("a.js",function(){

    $.holdReady(false);

});

alert(2);

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

ready()  :  准备DOM触发

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

isFunction()  :  是否为函数

            alert(typeof alert);

IE8以前返回Object

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

isArray()  :  是否为数组

          Array.isArray();

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

isWindow()  :  是否为window

          alert($.isWindow(window));=>true

          window作用：1.全局对象

                                   2.浏览器窗口

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

isNumeric()  :  是否为数字 

          alert(typrof 123);=>true

          alert(typeof NaN) ;=>true

           alert(isNumeric(123));=>true

            alert(isNumeric(NaN));=>false

            isFinite(Number.MAX_VALUE+1);//有限数字=>false

            isFinite(123123123);=>true    

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

type()  :  判断数据类型

        var a="Hello";=>String    

        var b=[];=>Array

        var c={};=>json

        var d=new Date();=>date

    alert({}.toString.call([]))=>[object array]

原生的js区分不了json，date，数组

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

isPlainObject()  :  是否为对象自变量    

   （ 1.不是Object 2.Dom节点 3.Window）=>false;

   （constructor&&Object.prototype,"isprototype"）;

    var obj={};=>true

    var obj= new Object();=>true;

    var obj=[];=>false;

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

isEmptyObject()  :  是否为空的对象

            var obj=null;

            var obj={};

            var obj=[];

            function aaa(){}

            var obj=new  aaa();

            $.isEmptyObject(obj)=>true

    ++++++++++++++++++++

        for(name  in  object ){}

        系统自带得 循环不到

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

error()  :  抛出异常

          $.error("这是错误");

           便签

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

parseHTML()  :  解析节点

var str ="<li></li><li></li><script><\/script>";       

 $.parseHTML(str,documrnt,true);==>[<li>,<li>,<script>]

$.parseHTML(str,documrnt,false);==>[<li>,<li>]

$("<li></li>")=>$.parseHTML();

核心创建DOM：jQuery.buildFragment();

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

parseJSON()  :  解析JSON

var str='{"name":"Hello"}';

$.parseJSON(str);支持严格json格式

JSON.parse和eval；

JSON.stringify();【Json=>String】

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

parseXML()  :  解析XML

<script>

var xml = "<rss version='2.0'><channel><title>RSS Title</title></channel></rss>",

xmlDoc = $.parseXML( xml ),

$xml = $( xmlDoc ),

$title = $xml.find( "title" );

// Append "RSS Title" to #someElement

$( "#someElement" ).append( $title.text() );

// Change the title to "XML Title"

$title.text( "XML Title" );

// Append "XML Title" to #anotherElement

$( "#anotherElement" ).append( $title.text() );

</script>

new DOMParser().parseFromString(data,"text/xml");支持IE8以上

<parsererror>错误信息</parsererror>

ActiveXObject低版本的XML解析

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

noop()  :  空函数

    noop：function(){},

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

globalEval()  :  全局解析JS

function test() {

jQuery.globalEval( "var newVar = true;" );//把局部变量转成全局变量

var newVar = true;//局部变量

}

test();

alert( newVar );

 

function test() {

  var val=eval;

   val("var a=1");

   window.eval("var a=1");

}

alert(1);

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

camelCase()  :  转驼峰(内部)

margin-left  -> maginLeft

 

IE :  -ms-transform ->msTransfrom

其他 ：-moz-transform ->MozTransfrom

 

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

nodeName()  :  是否为指定节点名(内部)

$(function(){

    $.nodeName(document. documentElement,'html');=>true

    $.nodeName(document. body,'html');=>false

});

 

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

each()  :  遍历集合

var arr=[1,2,3,4];

var json={"id":"111","name":"zhangsan "}

 

this ->{0:,1:,length:2}

$.each(arr,function(i,value){

       alert(value);

});

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

trim()  :  去前后空格

IE 低版本需要自己写正则

var str ="  Hello    ";

alert("("+str+")");

alert("("+$.trim(str)+")");

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

makeArray()  :  类数组转真数组

var str="Hello";

$.makeArray(str); -> [Hello]

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

inArray()  :  数组版indexOf

var arr={'a','b','c','d'}

$.inArray('b',arr);  -> 2

$.inArray('w',arr);  -> -1

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

merge()  :  合并数组

if : $.merge(['a','b'],['c','d']); ->['a','b','c','d']

else: $.merge(['a','b'],{0:'c',1:'d'}); ->{0:'a',1:'b',2:'c',3:'d'}

          $.merge({0:'a',1:'b',length:2},{0:'c',1:'d'}); -> {0:'a',1:'b',2:'c',3:'d',length:4}

          $.merge({0:'a',1:'b',length:2},['c','d']); -> {0:'a',1:'b',2:'c',3:'d',length:4}

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

grep()  :  过滤新数组

var arr=[1,2,3,4];

arr=$.grep(arr,function(n,i){

    return n>2;

}); ->[3,4]

arr=$.grep(arr,function(n,i){

    return n>2;

},true); ->[1,2]

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

map()  :  映射新数组

var arr=[1,2,3,4];

arr=$.map(arr,function(n){

        return n+1;

}); ->[2,3,4,5]

 

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

guid  :  唯一标识符(内部)    

事件函数关联，查找和关联

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

proxy()  :  改this指向

function show(n1,n2){

alert(n1);

alert(n2);

alert(this);

}

$.proxy(show,document)(3,4); ->3,4

$.proxy(show,document,3,4)(); ->3,4

$.proxy(show,document,3)(4); ->3,4

简化的写法：

var obj={

    show : function(){

        alert(this);

    }

}

$.proxy(obj.show,obj) ===$.proxy(obj,"show")

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

access()  :  多功能值操作(内部)

$().css();  $().attr()  get/set

$(function(){

    $("#div1").css("background")//get

    $("#div1").css("background","yellow")//set

    $("#div1").css({background : "yellow" , width : "300px"}) //多值set

});

<div id='div1' style="width:100px;height:100;background:red"></div>

 

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

now()  :  当前时间

$.now();//1970.1.1距今的毫秒数

now : Date.now 低版本的不支持

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

swap()  :  CSS交换(内部)

$(function(){

    $("#div1").css("width")//jquery  ->100

     $("#div1").get(0).offserWidth;//源生display:none  ->0

});

<div id='div1' style="width:100px;height:100;background:red;display:none"></div>

实现方式 ： 把值去掉，获取值，添加样式

 

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

});

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

$().ready();

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

function isArraylike(){}  类似数组的判断(内部)

function show(){

    arguments.isArraylike();

}

show('a','b','c','d');

 

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

rootjQuery=jQuery(document);

 

 

 

 

来自为知笔记(Wiz)