jQuery中的工具（十）
1. jQuery.each(object, [callback]), 通用遍历方法，可用于遍历对象和数组
不同于遍历 jQuery 对象的 $().each() 方法，此方法可用于遍历任何对象。回调函数拥有两个参数：第一个为对象的成员或数组的索引，第二个为对应变量或内容。如果需要退出 each 循环可使回调函数返回 false，其它返回值将被忽略。
参数说明：
- object：需要遍历的对象或数组。
- callback：每个成员/元素执行的回调函数。
//遍历数组 $.each( [0,1,2], function(i, n){ alert( "Item #" + i + ": " + n ); }); //遍历对象 $.each( { name: "John", lang: "JS" }, function(i, n){ alert( "Name: " + i + ", Value: " + n ); });
2. jQuery.extend([deep], target, object1, [objectN]), 用一个或多个其他对象来扩展一个对象，返回被扩展的对象
果不指定target，则给jQuery命名空间本身进行扩展。这有助于插件作者为jQuery增加新方法。 如果第一个参数设置为true，则jQuery返回一个深层次的副本，递归地复制找到的任何对象。否则的话，副本会与原对象共享结构。 未定义的属性将不会被复制，然而从对象的原型继承的属性将会被复制。
参数说明：
- target,[object1],[objectN]
-
target：一个对象，如果附加的对象被传递给这个方法将那么它将接收新的属性，如果它是唯一的参数将扩展jQuery的命名空间。
-
object1：待合并到第一个对象的对象。
-
objectN：待合并到第一个对象的对象。
-
- [deep],target,object1,[objectN]
-
deep：如果设为true，则递归合并。
-
target：待修改对象。
-
object1：待合并到第一个对象的对象。
-
-
- objectN：待合并到第一个对象的对象。
//合并 settings 和 options，修改并返回 settings var settings = { validate: false, limit: 5, name: "foo" }; var options = { validate: true, name: "bar" }; jQuery.extend(settings, options); //返回结果 settings == { validate: true, limit: 5, name: "bar" } //合并 defaults 和 options, 不修改 defaults。 var empty = {}; var defaults = { validate: false, limit: 5, name: "foo" }; var options = { validate: true, name: "bar" }; var settings = jQuery.extend(empty, defaults, options); //返回结果 settings == { validate: true, limit: 5, name: "bar" } empty == { validate: true, limit: 5, name: "bar" }
3. jQuery.grep(array, callback, [invert]), 使用过滤函数过滤数组元素
此函数至少传递两个参数：待过滤数组和过滤函数。过滤函数必须返回 true 以保留元素或 false 以删除元素。
参数说明：
- array,callback,[invert] Array,Function,Boolean
-
array:待过滤数组。
-
callback:此函数将处理数组每个元素。第一个参数为当前元素，第二个参数而元素索引值。此函数应返回一个布尔值。另外，此函数可设置为一个字符串，当设置为字符串时，将视为“lambda-form”（缩写形式？），其中 a 代表数组元素，i 代表元素索引值。如“a > 0”代表“function(a){ return a > 0; }”。
-
invert:如果 "invert" 为 false 或为设置，则函数返回数组中由过滤函数返回 true 的元素，当"invert" 为 true，则返回过滤函数中返回 false 的元素集。
-
//过滤数组中小于 0 的元素。 $.grep( [0,1,2], function(n,i){ return n > 0; }); //返回结果：[1, 2] //排除数组中大于 0 的元素，使用第三个参数进行排除。 $.grep( [0,1,2], function(n,i){ return n > 0; }, true); //返回结果：[0]
4. jQuery.when(deferreds), 提供一种方法来执行一个或多个对象的回调函数，延迟对象通常表示异步事件
参数说明：
- deferreds：一个或多个延时对象或JS对象
when()函数常常和done()函数、fail()函数、then()函数联合使用：
- done(Function func) ： 当deferreds中的处理都完成的时候执行Function回调函数
-
fail(Function func) ：当deferreds中有一个处理失败的时候执行Function回调函数
-
then(Function func1,Function func2)-：结合了done和fail函数，当都成功执行func1，当有一个失败执行func2
$.when( $.ajax("test.aspx") ).then(function(ajaxArgs){
alert(ajaxArgs[1]); /* ajaxArgs is [ "success", statusText, jqXHR ] */
});
$.when( { testing: 123 } ).done(
function(x){ alert(x.testing); } /* alerts "123" */
);
$.when($.ajax("/page1.php"), $.ajax("/page2.php")).done(function(a1, a2){
/* a1 and a2 are arguments resolved for the
page1 and page2 ajax requests, respectively */
var jqXHR = a1[2]; /* arguments are [ "success", statusText, jqXHR ] */
if ( /Whip It/.test(jqXHR.responseText) ) {
alert("First page has 'Whip It' somewhere.");
}
});
$.when($.ajax("/page1.php"), $.ajax("/page2.php"))
.then(myFunc, myFailure);
5. jQuery.makeArray(obj), 将类数组对象转换为数组对象
类数组对象有 length 属性，其成员索引为 0 至 length - 1。实际中此函数在 jQuery 中将自动使用而无需特意转换。
<div>First</div><div>Second</div><div>Third</div><div>Fourth</div> var arr = jQuery.makeArray(document.getElementsByTagName("div")); arr.reverse(); // 使用数组翻转函数 //结果 Fourth Third Second First
6. jQuery.map(arr|obj,callback), 将一个数组中的元素转换到另一个数组中
作为参数的转换函数会为每个数组元素调用，而且会给这个转换函数传递一个表示被转换的元素作为参数。转换函数可以返回转换后的值、null（删除数组中的项目）或一个包含值的数组，并扩展至原始数组中。
参数说明：
- array,callback
-
array：待转换数组。
-
-
- callbackArray：为每个数组元素调用，而且会给这个转换函数传递一个表示被转换的元素作为参数。函数可返回任何值。另外，此函数可设置为一个字符串，当设置为字符串时，将视为“lambda-form”（缩写形式？），其中 a 代表数组元素。如“a * a”代表“function(a){ return a * a; }”。
- arrayOrObject,callback
-
arrayOrObject：数组或者对象。
-
-
- callback：为每个数组元素调用，而且会给这个转换函数传递一个表示被转换的元素作为参数。函数可返回任何值。另外，此函数可设置为一个字符串，当设置为字符串时，将视为“lambda-form”（缩写形式？），其中 a 代表数组元素。如“a * a”代表“function(a){ return a * a; }”。
//将原数组中每个元素加 4 转换为一个新数组。 $.map( [0,1,2], function(n){ return n + 4; }); //结果:[4, 5, 6] //原数组中大于 0 的元素加 1 ，否则删除。 $.map( [0,1,2], function(n){ return n > 0 ? n + 1 : null; }); //结果：[2, 3] //原数组中每个元素扩展为一个包含其本身和其值加 1 的数组，并转换为一个新数组。 $.map( [0,1,2], function(n){ return [ n, n + 1 ]; }); //结果：[0, 1, 1, 2, 2, 3]
7. jQuery.inArray(value,array,[fromIndex]), 确定第一个参数在数组中的位置，从0开始计数(如果没有找到则返回 -1 )
参数说明：
- value,array,[fromIndex]
- value：用于在数组中查找是否存在
- array：待处理数组
- fromIndex：用来搜索数组队列，默认值为0
var arr = [ 4, "Pete", 8, "John" ]; jQuery.inArray("John", arr); //3 jQuery.inArray(4, arr); //0 jQuery.inArray("David", arr); //-1 jQuery.inArray("Pete", arr, 2); //-1
8. jQuery.toArray(), 把jQuery集合中所有DOM元素恢复成一个数组
alert($('li').toArray());
9. jQuery.merge(first,second), 合并两个数组
返回的结果会修改第一个数组的内容——第一个数组的元素后面跟着第二个数组的元素。要去除重复项，请使用$.unique()
参数说明：
-
first:第一个待处理数组，会改变其中的元素。
-
second:第二个待处理数组，不会改变其中的元素。
$.merge( [0,1,2], [2,3,4] ) //结果：[0,1,2,2,3,4]
10. jQuery.unique(array), 删除数组中重复元素
只处理删除DOM元素数组，而不能处理字符串或者数字数组。在jQuery 3.0以上版本该方法已被弃用，请使用 jQuery.uniqueSort()方法。
//删除重复 div 标签 $.unique(document.getElementsByTagName("div"));
11. jQuery.parseJSON(str), 接受一个JSON字符串，返回解析后的对象
在jQuery 3.0 及以后版本中，该方法已被删除，请使用原生方法 JSON.parse(str)。
传入一个畸形的JSON字符串会抛出一个异常，如：
- {test: 1} （ test 没有包围双引号）
-
{'test': 1} （使用了单引号而不是双引号）
另外，如果你什么都不传入，或者一个空字符串、null或undefined，parseJSON都会返回 null
var obj = jQuery.parseJSON('{"name":"John"}'); alert( obj.name === "John" );
12. jQuery.parseXML(data), 解析一个字符串到一个XML文件
jQuery.parseXML使用原生解析函数浏览器创建一个有效的XML文档。这文档可以被传递给jQuery创建一个典型的jQuery对象，可以查询及操作
//建一个jQuery对象使用一个XML字符串并得到标题节点的值 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() );
13. jQuery.noop, 一个空函数
当你仅仅想要传递一个空函数的时候，就用他吧。这对一些插件作者很有用，当插件提供了一个可选的回调函数接口，那么如果调用的时候没有传递这个回调函数，就用jQuery.noop来代替执行。
14. jQuery.proxy(function,context), jQuery 1.4 新增。返回一个新函数，并且这个函数始终保持了特定的作用域
当有事件处理函数要附加到元素上，但他们的作用域实际是指向另一个对象时，这个方法最有用了。此外，最妙的是，jQuery能够确保即便你绑定的函数是经过jQuery.proxy()处理过的函数，你依然可以传递原先的函数来准确无误地取消绑定。
这个函数还有另一种用法，jQuery.proxy( scope, name )。第一个参数是要设定的作用域对象。第二个参数是将要设置作用域的函数名（必须是第一个作用域对象的一个属性）。
参数说明：
- function,context Function,Object
-
function：将要被改变作用域的函数
- context：一个object，那个函数的作用域会被设置到这个object上来。
-
- context,name Object,Object
-
- context:一个object，那个函数的作用域会被设置到这个object上来。
- name：改变上下文中的函数名(这个函数必须是前一个参数 'context' 对象的属性)
//强制设置函数的作用域，让this指向obj而不是#test对象。 <div id="test">Click Here!</div> var obj = { name: "John", test: function() { alert( this.name ); $("#test").unbind("click", obj.test); } }; $("#test").click( jQuery.proxy( obj, "test" ) ); // 以下代码跟上面那句是等价的: // $("#test").click( jQuery.proxy( obj.test, obj ) ); // 可以与单独执行下面这句做个比较。 // $("#test").click( obj.test );
15. jQuery.contains(container,contained), 一个DOM节点是否包含另一个DOM节点
参数说明：
-
container：DOM元素作为容器，可以包含其他元素
- contained：DOM节点，可能被其他元素所包含
jQuery.contains(document.documentElement, document.body); // true jQuery.contains(document.body, document.documentElement); // false
16. jQuery.type(obj), 检测obj的数据类型
jQuery.type(true) === "boolean" jQuery.type(3) === "number" jQuery.type("test") === "string" jQuery.type(function(){}) === "function" jQuery.type([]) === "array" jQuery.type(new Date()) === "date" jQuery.type(/test/) === "regexp"
17. jQuery.isEmptyObject(obj), 测试对象是否是空对象（不包含任何属性）
jQuery 1.4 新增。jQuery 1.4 中，这个方法既检测对象本身的属性，也检测从原型继承的属性（因此没有使用hasOwnProperty）。
jQuery.isEmptyObject({}) // true
jQuery.isEmptyObject({ foo: "bar" }) // false
18. jQuery.isPlainObject(obj), 测试对象是否是纯粹的对象（通过 "{}" 或者 "new Object" 创建的）
jQuery.isPlainObject({}) // true
jQuery.isPlainObject("test") // false
19. jQuery.isNumeric(value), 确定它的参数是否是一个数字
jQuery V1.7新增。
$.isNumeric() 方法检查它的参数是否代表一个数值。如果是这样，它返回 true。否则，它返回false。该参数可以是任何类型的
$.isNumeric("-10"); // true
$.isNumeric(16); // true
$.isNumeric(0xFF); // true
$.isNumeric("0xFF"); // true
$.isNumeric("8e5"); // true (exponential notation string)
$.isNumeric(3.1415); // true
$.isNumeric(+10); // true
$.isNumeric(0144); // true (octal integer literal)
$.isNumeric(""); // false
$.isNumeric({}); // false (empty object)
$.isNumeric(NaN); // false
$.isNumeric(null); // false
$.isNumeric(true); // false
$.isNumeric(Infinity); // false
$.isNumeric(undefined); // false
20. jQuery.trim(str), 去掉字符串起始和结尾的空格
$.trim(" hello, how are you? ");
21. jQuery.param(obj,[traditional]), 将表单元素数组或者对象序列化。是.serialize()的核心方法
在jQuery 1.3中，如果传递的参数是一个函数，那么用.param()会得到这个函数的返回值，而不是把这个函数作为一个字符串来返回。
在jQuery 1.4中，.param()会深度递归一个对象来满足现在脚本语言和框架，比如PHP， Ruby on Rails等。你可以通过jQuery.ajaxSettings.traditional = true; 来全局得禁用这个功能。
注意：因为有些框架在解析序列化数字的时候能力有限，所以当传递一些含有嵌套对象、数组的对象作为参数时，请务必小心！
在jQuery 1.4中，HTML5的input元素也会被序列化。
参数说明：
- obj Array<Elements>/jQuery/Object
- 数组或jQuery对象会按照name/value对进行序列化，普通对象按照key/value对进行序列化
- obj,[traditional] Array<Elements>/jQuery/Object,Boolean
-
obj：数组或jQuery对象会按照name/value对进行序列化，普通对象按照key/value对进行序列化。
-
-
- traditional：是否使用传统的方式浅层序列化。
var params = { width:1680, height:1050 }; var str = jQuery.param(params); $("#results").text(str); //width=1680&height=1050
22. jQuery.error(message), 接受一个字符串，并且直接抛出一个包含这个字符串的异常
这个方法的主要目的是提供给插件开发人员，让他们可以重载这个方法，并以更好的方式显示错误，或者提供更多信息。
23. $.fn.jquery, 代表 jQuery 版本号的字符串
.jquery 属性是通过 jQuery 原型赋值的，通过使用它的别名 $.fn 进行引用。它是一个含有 jQuery 版本号的字符串，例如 "1.5.0" 或 "1.4.4".
//判断一个对象是否是 jQuery 对象。 var a = { what: "A regular JS object" }, b = $('body'); if ( a.jquery ) { // falsy, since it's undefined alert(' a is a jQuery object! '); } if ( b.jquery ) { // truthy, since it's a string alert(' b is a jQuery object! '); } //取得页面上当前使用的 jQuery 的版本号。 alert( 'You are running jQuery version: ' + $.fn.jquery );
