jQuery常用数据处理方法小结

 更新时间:2015年02月20日 14:53:08   作者:novaline  
这篇文章主要介绍了jQuery常用数据处理方法,实例总结了trim、param、isArray、isFunction、each等jQuery常用的数据处理方法,具有一定参考借鉴价值,需要的朋友可以参考下

本文实例总结了jQuery常用数据处理方法。分享给大家供大家参考。具体如下:

$.trim():删除字符串前后的空白字符。

var str = ' 薯条 ';
var formatStr = $.trim(str);  //'薯条'

$.param():数组或者对象序列化。

var obj = {
  name: 'dog',
  count: 10
};
var str = $.param(obj); //"name=dog&count=10"

$.isArray():检测是否为数组。
$.isFunction():检测是否为函数类型。
$.each(obj, [callback]):遍历数组或者集合对象。obj是要遍历的集合对象,callback表示回调函数,该函数将在遍历每个成员时出发。回调函数包含两个参数,第一个参数为对象成员或数组的索引,第二个参数为对应的值。

var a = [x,y,z];
$.each(a, function(index, value) {
  console.log(index); //0,1,2
  console.log(value); //x,y,z
});
var b = {x:1, y:2, z:3};
$.each(b, function(key, value)) {
  console.log(key);  //x,y,z
  console.log(value); //1,2,3
}

说明:如果中途要退出each()循环,可以在回调函数中返回false,其他返回值将被忽略。

$.each()和$(selector).each()功能相同,但$.each()可以遍历任何对象或数组,而$(selector).each()只能遍历当前选择器选择的jQuery对象。

$.makeArray():把类数组对象转换为数组对象。所谓类数组对象,就是拥有length属性,索引从0到length-1。但是这些对象不能够调用数组方法。

var arr = $.makeArray($('li')); //类数组对象转换为数组
$('ul').html(arr.reverse()); //可以调用数组的reverse()方法了

$.grep():根据过滤函数过滤掉数组中不符合条件的元素。

$.grep(array, callback, [invert]);

说明:参数array表示要过滤的数组,callback表示过滤函数。如果过滤函数返回true,则保留元素,如果过滤函数返回false,则删除元素。参数invert,可选,如果为false或者没有设置,则返回数组中由过滤函数返回true的元素;如果该参数为true,则返回过滤函数中返回false的元素。

var a = [1,2,3,4,5];
a = $.grep(a, function(value, index)) {
  return value > 3; //a现在为[4,5]
});
var b = [1,2,3,4,5];
b = $.grep(b, function(value, index)) {
  return value > 3; //b现在为[1,2,3]
}, true);

$.map():映射数组。
$.map(array, callback);

var a = [1,2,3,4];
a = $.map(a, function(elem)) {
  return elem * 2; //a现在为[2,4,6,8]
});

$.merge():合并数组。
说明:接受两个数组参数。

var a = [1,2,3];
var b = [4,5];
var c = $.merge(a,b); //c为[1,2,3,4,5];

$.unique():删除DOM元素数组中的重复项。

...
<a id="1" class="link link1"></a>
<a id="2" class="link"></a>
<a id="3" class="link"></a>
...
var $link = $('.link'); //包含#1,#2,#3
var $firstLink = $('.link1'); //包含#1
var $links = $.merge($link, $firstLink); //包含#1,#2,#3,#1
var $linkList = $.unique($link); //包含#1,#2,#3

说明:只能处理DOM元素数组,不能处理字符串或者JavaScript数组。

希望本文所述对大家的jQuery程序设计有所帮助。

相关文章

  • js/jquery判断浏览器类型的方法小结

    js/jquery判断浏览器类型的方法小结

    有些时候需要根据浏览器来写样式,所以要判断一下浏览器类型,百度了一下,才知道JQuery有个方法直接判断,并附上原生的js的判断方法,分享给大家,有需要的小伙伴可以参考下。
    2015-05-05
  • 使用jQuery实现返回顶部

    使用jQuery实现返回顶部

    博客园是程序员们比较喜欢的聚集地,很多人喜欢发发心得,一直都觉着挺好的,但最不满意他的一点是,没有返回到顶部的功能,好吧,我们自己来添。
    2015-01-01
  • Jquery中给animation加更多的运作效果实例

    Jquery中给animation加更多的运作效果实例

    这篇文章介绍了Jquery中给animation加更多的运作效果实例,有需要的朋友可以参考一下
    2013-09-09
  • jQuery事件 delegate()使用方法介绍

    jQuery事件 delegate()使用方法介绍

    delegate() 方法为指定的元素(属于被选元素的子元素)添加一个或多个事件处理程序,并规定当这些事件发生时运行的函数
    2012-10-10
  • jQuery选择器实例应用

    jQuery选择器实例应用

    这篇文章主要为大家详细介绍了jQuery选择器实例应用,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-01-01
  • jQuery实现鼠标响应式淘宝动画效果示例

    jQuery实现鼠标响应式淘宝动画效果示例

    这篇文章主要介绍了jQuery实现鼠标响应式淘宝动画效果,涉及jQuery事件响应及页面元素属性动态操作相关使用技巧,需要的朋友可以参考下
    2018-02-02
  • jQuery自动切换/点击切换选项卡效果的小例子

    jQuery自动切换/点击切换选项卡效果的小例子

    我们看到很多网站会有有错误404页面,当页面不存存时就会提示,然后过几秒就会自动跳到首页了,下面我来给大家举一个404错误页面跳到首页实例,有需要的朋友可以参考一下
    2013-08-08
  • 针对后台列表table拖拽比较实用的jquery拖动排序

    针对后台列表table拖拽比较实用的jquery拖动排序

    这篇文章主要为大家详细介绍了比较实用的jquery拖动排序,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-10-10
  • jQuery/CSS3图片特效插件整理推荐

    jQuery/CSS3图片特效插件整理推荐

    这里给大家整理汇总了10款jQuery/CSS3图片特效插件,效果都非常棒,推荐给大家,有需要的小伙伴参考下
    2014-12-12
  • jquery $.each()使用探讨

    jquery $.each()使用探讨

    想必大家对jquery $.each()并不陌生吧,使用它可以进行元素的遍历,下面有个不错的示例,感兴趣的朋友可以参考下
    2013-09-09

最新评论