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();
jQuery扩展工具方法_第1张图片
核心创建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 ->MozT ransfrom
 
----------------------------------------------
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);
 
 
 
 





你可能感兴趣的:(jquery)