jQuery常用数据处理方法小结

 这篇文章主要介绍了jQuery常用数据处理方法,实例总结了trim、param、isArray、isFunction、each等jQuery常用的数据处理方法,具有一定参考借鉴价值,需要的朋友可以参考下

 
 

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

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

?

1
2

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

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

?

1
2
3
4
5

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

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

?

1
2
3
4
5
6
7
8
9
10

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。但是这些对象不能够调用数组方法。

?

1
2

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

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

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

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

?

1
2
3
4
5
6
7
8

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);

?

1
2
3
4

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

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

?

1
2
3

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

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

?

1
2
3
4
5
6
7
8
9

...
<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程序设计有所帮助。

时间: 2024-10-15 13:49:33

jQuery常用数据处理方法小结的相关文章

Jquery常用的方法汇总_jquery

//jQuery的优点 :          1 轻量级         2 强大的选择器         3 出色的DOM操作的封装         4 可靠的事件处理机制         5 完善的Ajax         6 不污染顶级变量         7 出色的浏览器兼容性         8 链式操作方式         9 隐式迭代         10 行为曾与结构层的分离         11 丰富的插件支持         12 完善的文档         13 开源 <s

Jquery操作Ajax方法小结_jquery

ajax() 方法通过 HTTP 请求加载远程数据. 该方法是 jQuery 底层 AJAX 实现.简单易用的高层实现见 $.get, $.post 等.$.ajax() 返回其创建的 XMLHttpRequest 对象.大多数情况下你无需直接操作该函数,除非你需要操作不常用的选项,以获得更多的灵活性. 最简单的情况下,$.ajax() 可以不带任何参数直接使用. 注意:所有的选项都可以通过 $.ajaxSetup() 函数来全局设置. 语法 jQuery.ajax([settings]) 参数

利用jquery操作Radio方法小结_jquery

在开发中经常会用到Radio来实现用户的选择效果,我在项目中积累了一些利用JQUERY来操作Radio的方法,在这里分享一下,供有需要的朋友借鉴. 1.改变radio的选择,触发一些效果 复制代码 代码如下: $("input:radio[name='dialCheckResult']").change(function (){ //拨通 alert("123"); }); 2.让页面中所有的radio可用. $("input:radio").a

jQuery常用事件方法详解

jQuery事件 readyfnfunction jQueryon jQueryclick jQuerydata jQuerysubmit jQuery事件 ready(fn)|$(function(){}) (document).ready(function())可以简写成(function(){}); 当DOM载入就绪可以查询及操纵时绑定一个要执行的函数. 这是事件模块中最重要的一个函数,因为它可以极大地提高web应用程序的响应速度. 简单地说,这个方法纯粹是对向window.load事件注

Jquery Ajax请求方法小结(值得收藏)_AJAX相关

 jQuery确实是一个挺好的轻量级的JS框架,能帮助我们快速的开发JS应用,并在一定程度上改变了我们写JavaScript代码的习惯. 废话少说,直接进入正题,我们先来看一些简单的方法,这些方法都是对jQuery.ajax()进行封装以方便我们使用的方法,当然,如果要处理复杂的逻辑,还是需要用到jQuery.ajax()的(这个后面会说到). 1. load( url, [data], [callback] ) :载入远程 HTML 文件代码并插入至 DOM 中. url (String) :

jquery常用特效方法使用示例_jquery

1. jQuery fadeIn() 用于淡入已隐藏的元素. 语法: 复制代码 代码如下: $(selector).fadeIn(speed,callback); 实例: 复制代码 代码如下: $("button").click(function(){  $("#div1").fadeIn();  $("#div2").fadeIn("slow");  $("#div3").fadeIn(3000);});

Jquery Ajax请求方法小结(值得收藏)

jQuery确实是一个挺好的轻量级的JS框架,能帮助我们快速的开发JS应用,并在一定程度上改变了我们写JavaScript代码的习惯. 废话少说,直接进入正题,我们先来看一些简单的方法,这些方法都是对jQuery.ajax()进行封装以方便我们使用的方法,当然,如果要处理复杂的逻辑,还是需要用到jQuery.ajax()的(这个后面会说到). 1. load( url, [data], [callback] ) :载入远程 HTML 文件代码并插入至 DOM 中. url (String) :

jquery常用的12个小功能_jquery

jquery12个常用功能极好的,快来围观! 返回顶部使用JQuery的animate和scrollTop方法可以创建简单地返回顶部的动画: // Back to top $('a.top').click(function (e) { e.preventDefault(); $(document.body).animate({scrollTop: 0}, 800); }); HTML中得有一个按钮: <!-- Create an anchor tag --> <a class="

jQuery操作表单常用控件方法小结

 这篇文章主要介绍了jQuery操作表单常用控件方法,实例总结了jQuery针对常用表单控件的操作技巧,具有一定参考借鉴价值,需要的朋友可以参考下     本文实例总结了jQuery操作表单常用控件方法.分享给大家供大家参考.具体如下: 下面的JS代码列出了jQuery操作表单常用控件(包括select,radiobox,checkbox)的常用方法,相信一定有你需要的 操作radio的html代码 ? 1 2 3 4 Radion <input type="radio" nam