jQuery慢慢啃之工具(十)

1.jQuery.support//一组用于展示不同浏览器各自特性和bug的属性集合

 

2.jQuery.browser//浏览器内核标识。依据 navigator.userAgent 判断。

可用值: safari opera  msie mozilla 

 

3.jQuery.browser.version//浏览器渲染引擎版本号

 

4.jQuery.boxModel//浏览器是否使用标准盒模型渲染页面。 建议使用 jQuery.support.boxModel 代替。W3C CSS 盒模型.

 

5.jQuery.each(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 );});

 

6.jQuery.extend([deep], 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" }

 

7.jQuery.grep(array, callback, [invert])//使用过滤函数过滤数组元素。

此函数至少传递两个参数:待过滤数组和过滤函数。过滤函数必须返回 true 以保留元素或 false 以删除元素。

$.grep( [0,1,2], function(n,i){  return n > 0;});

array,callback,[invert]//:如果 "invert" 为 false 或为设置,则函数返回数组中由过滤函数返回 true 的元素,当"invert" 为 true,则返回过滤函数中返回 false 的元素集。
$.grep( [0,1,2], function(n,i){  return n > 0;}, true);

 

8.jQuery.makeArray(obj)//将类数组对象转换为数组对象。实际中此函数在 jQuery 中将自动使用而无需特意转

 

9.jQuery.map(arr|obj,callback)//将一个数组中的元素转换到另一个数组中

$.map( [0,1,2], function(n){  return n + 4;});
结果:[4, 5, 6]

 

10.jQuery.inArray(value,array,[fromIndex])//确定第一个参数在数组中的位置,从0开始计数(如果没有找到则返回 -1 )。

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

 

11.jQuery.toArray()//把jQuery集合中所有DOM元素恢复成一个数组

alert($('li').toArray());
结果:[<li id="foo">, <li id="bar">]

12.jQuery.sub()//可创建一个新的jQuery副本,不影响原有的jQuery对像

 

13.jQuery.when(deferreds)//提供一种方法来执行一个或多个对象的回调函数,延迟对象通常表示异步事件。

$.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" */);

 

14.jQuery.merge(first,second)//合并两个数组

first:第一个待处理数组,会改变其中的元素。

second:第二个待处理数组,不会改变其中的元素。

$.merge( [0,1,2], [2,3,4] )

结果:[0,1,2,2,3,4]

 

15.jQuery.unique(array)//删除数组中重复元素。只处理删除DOM元素数组,而不能处理字符串或者数字数组。

$.unique(document.getElementsByTagName("div"));

 

16返回值:StringjQuery.parseJSON(json)//接受一个JSON字符串,返回解析后的对象。

var obj = jQuery.parseJSON('{"name":"John"}');
alert( obj.name === "John" );

 

17.jQuery.parseXML(data)//解析一个字符串到一个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() );

 

18.jQuery.noop//一个空函数。当你仅仅想要传递一个空函数的时候,就用他吧。这对一些插件作者很有用,当插件提供了一个可选的回调函数接口,那么如果调用的时候没有传递这个回调函数,就用jQuery.noop来代替执行。

 

19.jQuery.proxy(function,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 );

 

20.jQuery.contains(container,contained)//一个DOM节点是否包含另一个DOM节点

jQuery.contains(document.documentElement, document.body); // true
jQuery.contains(document.body, document.documentElement); // false

 

21.jQuery.isArray(obj)//测试对象是否为数组。

$("b").append( " + $.isArray([]) );

 

22.jQuery.isFunction(obj)//测试对象是否为函数。

function stub() {
    }
var objs = [
            function () {},
            { x:15, y:20 },
            null,
            stub,
            "function"
          ];
        jQuery.each(objs, function (i) {
        var isFunc = jQuery.isFunction(objs[i]);
        $("span:eq( " + i + ")").text(isFunc);
      });

 

23.jQuery.isEmptyObject(obj)//测试对象是否是空对象

jQuery.isEmptyObject({}) // true
jQuery.isEmptyObject({ foo: "bar" }) // false

 

24.jQuery.isPlainObject(obj)//测试对象是否是纯粹的对象(通过 "{}" 或者 "new Object" 创建的)。

jQuery.isPlainObject({}) // true
jQuery.isPlainObject("test") // false

 

25.jQuery.isWindow(obj)//测试对象是否是窗口(有可能是Frame)。

<!DOCTYPE html>
<html>
<head>
  <script src="http://code.jquery.com/jquery-1.5.2.js"></script>
</head>
<body>
  Is 'window' a window? <b></b>
<script>$("b").append( "" + $.isWindow(window) );</script>

</body>
</html> 

 

26.jQuery.isNumeric(value)//确定它的参数是否是一个数字。

$.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

 

27.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" 

 

28.jQuery.trim(str)//去掉字符串起始和结尾的空格。

$.trim("  hello, how are you?  ");

 

29.jQuery.param(obj,[traditional])//将表单元素数组或者对象序列化。是.serialize()的核心方法。

   var params = { width:1680, height:1050 };

    var str = jQuery.param(params);
    $("#results").text(str);
结果:
width=1680&height=1050

对比两种序列化方式

var myObject = {
  a: {
    one: 1, 
    two: 2, 
    three: 3
  }, 
  b: [1,2,3]
};
var recursiveEncoded = $.param(myObject);
var recursiveDecoded = decodeURIComponent($.param(myObject));

alert(recursiveEncoded);
alert(recursiveDecoded);
//a%5Bone%5D=1&a%5Btwo%5D=2&a%5Bthree%5D=3&b%5B%5D=1&b%5B%5D=2&b%5B%5D=3
//a[one]=1&a[two]=2&a[three]=3&b[]=1&b[]=2&b[]=3

var shallowEncoded = $.param(myObject, true);
var shallowDecoded = decodeURIComponent(shallowEncoded);

alert(shallowEncoded);
alert(shallowDecoded);
//a=%5Bobject+Object%5D&b=1&b=2&b=3
//a=[object+Object]&b=1&b=2&b=3

 

30.jQuery.error(message)//接受一个字符串,并且直接抛出一个包含这个字符串的异常。

   重载jQuery.error,以便可以在Firebug里显示

jQuery.error = console.error;

 

31.$.fn.jquery//代表 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 );

 

posted @ 2015-02-06 13:56  yu_liantao  阅读(187)  评论(0编辑  收藏  举报