介绍几个jQuery实用函数

介绍几个jQuery实用函数

1、修剪字符串

$('#id').val($.trim($('#someid').val()))

2、遍历集合

 var anArray = ['one','two'];
$.each(anArray, funtion(n, value)...{
})
var anObject = ...{one: 1, two: 2};
$.each(anObjct, function(name,value)...{
})

		

3、筛选函数

jQuery.grep( array, callback, [invert] )

返回值: Array

说明:

使用过滤函数过滤数组元素。

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

grep方法的第二个参数是回调函数，该回调函数接收2个参数，一个是数组的元素，一个是数组的索引。
grep方法的第三个参数inv，默认情况下是undefined，所以!!inv为false，即inv的默认值是false

讲解:

默认invert为false, 即过滤函数返回true为保留元素. 如果设置invert为true, 则过滤函数返回true为删除元素.

举例1：int类型数组

var arr = [1, 2, 3, 4, 5, 6];
arr = $.grep(arr, function(val, index)...{
    return val > 3;
})
console.log(arr);//结果是：4 5 6

		

如果把grep的第三个参数显式地设置为true，结果怎样呢？

var arr = [1, 2, 3, 4, 5, 6];
arr = $.grep(arr, function(val, index)...{
    return val > 3;
}, true)
console.log(arr);//结果是：1 2 3

		

可见，当把grep方法的第三个参数设置为true后，会把不符合回调函数的数组元素过滤出来。

4、转换函数

jQuery.map( array, callback )

返回值:Array

说明:

将一个数组中的元素转换到另一个数组中。

作为参数的转换函数会为每个数组元素调用，而且会给这个转换函数传递一个表示被转换的元素作为参数。转换函数可以返回转换后的值、null（删除数组中的项目）或一个包含值的数组，并扩展至原始数组中。

5、返回数组元素的索引

使用$.inArray(value, array)返回传入的值第一次出现的下标，即索引。

var index = $.inArray(2, [1, 2, 3]);

6、将对象转换成数组

$.makeArray(object)将传入类似数组的对象转换成Javascript数组。

7、得到不含重复元素的数组

使用$.unique(array)返回由原始数组中不重复的元素组成的数组。

例如

<li>There are 6 lis in this document.</li>
<li></li>
<li class="dup"></li>
<li class="dup"></li>
<li class="dup"></li>
<li></li>

//把到所有li，get方法转换成javascript数组，总共6个li

var lis = $("li").get();

//再把3个class名为dup的li合并到前面的6个li

lis = lis.concat($(".dup").get());
alert(lis.length); //9个li

//过滤去掉重复

lis = jQuery.unqiue(lis);
alert(lis.length);//6个li

		

8、合并2个数组

$.merge(array1, array2)把第二个数组合并到第一个数组中，并返回第一个数组。

例如

var a1 = [1, 2];
var a2 = [2, 3];
$.merge(a1, a2);
console.log(a1);//[1, 2, 2, 3]

9、把对象序列化成查询字符串

$.param(params)把传入的jquery对象或javascript对象转换成字符串形式。

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

  personObj=new Object();
  personObj.firstname="John";
  personObj.lastname="Doe";
  personObj.age=50;
  personObj.eyecolor="blue"; 

  $("button").click(function()...{
    $("li").text($.param(personObj));
  });
});

		

结果：firstname=John&lastname=Doe&age=50&eyecolor=blue

10、一些判断函数

$.isArray(o) 如果o是javascript数组，则返回true,如果是类似数组的jquery对象数组，返回false
$.isEmptyObject(o) 如果o是不包含属性的javascript对象，则返回true
$.isFunction(o) 如果o是javascript函数就返回true
$.isPlainObject(o) 如果o是通过{}或new Object()创建的对象，则返回true
$.isXMLDoc(node) 如果node是XML文档或者是XML文档中的节点，则返回true

11、判断一个元素是否包含在另外一个元素中

$.contains(container, containee)第二个参数是被包含

例如

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

12、解析JSON

jQuery.parseJSON( json )第一个参数json的类型是字符串。

例如

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

13、动态加载脚本

$(selector).getScript(url,success(response,status))用来动态加载js文件，第一个参数是js的文件路径，第二个参数可选，表示获取js文件成功的回调。

例如

$.getScript( "ajax/test.js", function( data, textStatus, jqxhr ) ...{

  console.log( data ); // Data returned
  console.log( textStatus ); // Success
  console.log( jqxhr.status ); // 200
  console.log( "Load was performed." );

});