jquery以及js中那些好用的函数
2016-01-11 11:20
519 查看
<span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255);">初生牛犊用蛮力,经验不足的时候容易乱用方法,往往十分复杂且代码不健壮,注意适时请教,也注意积累经验。</span>
1、$.grep()方法是按照某种条件来过滤数组,所以使用$.grep()方法可以从数组中过滤出我们想要的结果。
grep(array,callback,invert)
array:待过滤数组;
callback:处理数组中的每个元素,并过滤元素,该函数中包含两个参数,第一个是当前数组元素的值,一个是当前数组元素的下标,即元素索引值。此函数应返回一个布尔值。另外,此函数可设置为一个字符串,当设置为字符串时,将视为“lambda-form”(缩写形式?),其中 a 代表数组元素,i 代表元素索引值。如“a > 0”代表“function(a){ return a > 0; }”
invert:布尔型可选项,默认值false,值为true或false, 如果 “invert” 为 false 或为设置,则函数返回数组中由过滤函数返回 true 的元素,当”invert” 为 true,则返回过滤函数中返回 false 的元素集。
var arr=$.grep([0,1,2,3,4,5,6],function(n,i){ return n>2; });
上面的例子返回[3,4,5,6],但是我们给invert的值为true,例如
var arr=$.grep([0,1,2,3,4,5,6],function(n,i){ return n>2; },ture);
所以现在返回的是[0,1,2],也就是被callback函数过滤掉的元素。
举一个使用的例子:
/** * 数组去重复 * @param array * @returns {Array} */ function uniQueue(array) { var arr = []; var m; while (array.length > 0) { m = array[0]; arr.push(m);//每次都要push进去,之后如果有相同存在,则会将所有此值剔除掉。 array = $.grep(array, function(n, i) { return n == m; }, true);//返回true,则为过滤掉符合条件的值:n==m,则过滤掉n和m } return arr; }
2、$.each(array, [callback]) 遍历[常用]。
解释: 不同于例遍jQuery对象的$().each()方法,此方法可用于例遍任何对象。回调函数拥有两个参数:第一个为对象的成员或数组的索引, 第二个为对应变量或内容. 如果需要退出each循环可使回调函数返回false(return false;),其他返回值将被忽略。
each遍历,相信都不陌生,在平常的事件处理中,是for循环的变体,但比for循环强大。在数组中,它可以轻松的攻取数组索引及对应的值。例:
$.each([52, 97], function(index, value) { alert(index + ': ' + value+‘ ’); });结果:0:52 1:97
如果对象作为集合使用,回调函数每次传递一个键值对:
var map = { 'flammable': 'inflammable', 'duh': 'no duh' }; $.each(map, function(key, value) { alert(key + ': ' + value); });结果为:
flammable: inflammableduh: no duh
3、. $.map(array,[callback])按给定条件转换数组
它可以根据特定条件,更新数组元素值,或根据原值扩展一个新的副本元素。如:
var arr = [2,3,6]; var arr2 = $.map(arr,function(item){return item*2;});4、$.inArray(val,array)判断值是否存在于数组中[常用]
解释: 确定第一个参数在数组中的位置, 从0开始计数(如果没有找到则返回-1)。
var _exist=$.inArray('墨子',_mozi); var _inexistence=$.inArray('卫鞅',_mozi) if(_exist>=0){ <span style="white-space:pre"> </span>alert('墨子 存在于数组_mozi中,其在数组中索引值是: '+_exist); }
nums = $.map(nums, function (num, index) { //和$.grep() 的区别 //return isNaN,得到结果为:[true, true] return isNaN(num) ? num : null;});console.log(nums); // ["jQuery", "CSS"]
5、js concat合并数组
concat() 方法用于连接两个或多个数组。该方法不会改变现有的数组,而仅仅会返回被连接数组的一个副本。如:
function concatArray1(){ var arr1 = [1,2,3,4]; var arr2 = [5,6,7,8]; var arr3 = [9,0]; arr1 = arr1.concat(arr2,arr3); return arr1;//arr1为[1,2,3,4,5,6,7,8,9,0] }
function concatArray2(){ var arr1 = [1,2,3,4]; var arr2 = [5,6,7,8]; var arr3 arr3 = arr1.concat(arr2); alert(arr1);//arr1不变,仍为[1,2,3,4] return arr3;//[1,2,3,4,5,6,7,8] }
6、js截取字符串方法
(1)substr,返回一个从指定位置开始的指定长度的子字符串。
stringvar.substr(start [, length ]) 参数 stringvar 必选项。要提取子字符串的字符串文字或 String 对象。 start 必选项。所需的子字符串的起始位置。字符串中的第一个字符的索引为 0。 length 可选项。在返回的子字符串中应包括的字符个数。 说明 如果 length 为 0 或负数,将返回一个空字符串。如果没有指定该参数,则子字符串将延续到 stringvar 的最后。示例如下:
function SubstrDemo(){ var s, ss; // 声明变量。 var s = "The rain in Spain falls mainly in the plain."; ss = s.substr(12, 5); // 获取子字符串。 return(ss); // 返回 "Spain"。 }
(2)substring,返回指定位置的子字符串。
strVariable.substring(start, end) "String Literal".substring(start, end) 参数 start 指明子字符串的起始位置,该索引从 0 开始起算。 end 指明子字符串的结束位置,该索引从 0 开始起算。 说明 substring 方法将返回一个包含从 start 到最后(不包含 end )的子字符串的字符串。 substring 方法使用 start 和 end 两者中的较小值作为子字符串的起始点。例如, strvar.substring(0, 3) 和 strvar.substring(3, 0) 将返回相同的子字符串。 如果 start 或 end 为 NaN 或者负数,那么将其替换为0。 子字符串的长度等于 start 和 end 之差的绝对值。例如,在 strvar.substring(0, 3) 和 strvar.substring(3, 0) 返回的子字符串的的长度是 3。
function SubstringDemo(){ var ss; // 声明变量。 var s = "The rain in Spain falls mainly in the plain.."; ss = s.substring(12, 17); // 取子字符串。 return(ss); // 返回子字符串。 }注;不包含end处字符。
相关文章推荐
- jquery使用淘宝接口跨域查询手机号码归属地实例
- jQuery 菜单显示隐藏
- Jquery-判断form表单数据是否变化
- jQuery EasyUI使用教程之格式化数据网格列
- jquery 获取图片真实大小的两种方法
- 提升jQuery的性能需要做好七件事
- jQuery 移动端artEditor富文本编辑器
- jQuery命名空间,自定义空间及属性,插件开发全解析
- [jquery] jQuery 选择器>
- js(jQuery)获取时间的方法及常用时间类
- 基于jquery封装的一个调色板,用到了Deferred对象回调
- 一个PHP一直执行的例子 不会计划任务可以用这个 PHP+jquery前台动态显示数据库内容
- Jquery 实现动态加入table tr 和删除tr 以及checkbox的全选 和 获取加入TR删除TR后的数据
- jquery中checkbox选择和全选
- jQuery 移动端artEditor富文本编辑器
- 提升jQuery的性能需要做好七件事
- jquery插件EasyUI中form表单提交实例分享
- 【JavaScript】JQuery与你相见恨晚
- jquery(ajax)
- jquery级联下拉框