JQuery常用和很有用处的方法

1、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函数过滤掉的元素。
 
2、$.map()

      函数用于使用指定函数处理数组中的每个元素(或对象的每个属性),并将处理结果封装为新的数组返回。

  1. 在jQuery 1.6 之前,该函数只支持遍历数组;从 1.6 开始,该函数也支持遍历对象。 
  2. map()还会为函数传入两个参数:其一是当前迭代的元素或属性值,其二是当前迭代项的数组索引或对象属性名。 
  3. 该函数返回值将作为结果数组中的一个元素,如果返回值为null或undefined,则不会被添加到结果数组中。

    var arr =$.map( [0,1,2], function(n){
        return n + 4;
    });//[4,5,6]

  上面每个数组中加了4

3、off()

$(selector).off(event,selector,function(eventObj),map)

 

   off() 方法通常用于移除通过 on() 方法添加的事件处理程序。自 jQuery 版本 1.7 起,off() 方法是 unbind()、die() 和 undelegate() 方法的新的替代品

  这是一个取消绑定的方法,如 你在一个元素上 $el.on.... 绑定了很多方法(click,moueover,moueout等等。。。), 你想取消所有方法绑定你就可以用 $el.off(),取消所有绑定

  注意:如需移除指定的事件处理程序,当事件处理程序被添加时,选择器字符串必须匹配 on() 方法传递的参数。

4、extend()

$.extend( target [, object1 ] [, objectN ] )

指示是否深度合并

$.extend( [deep ], target, object1 [, objectN ] )

  jQuery.extend() 函数用于将一个或多个对象的内容合并到目标对象。

这个可以用于传递 默认对象时可以用到,很方便  $el.extend({},defaulte,params);

5、data

$.data( element, key, value )

$.data() 函数用于在指定的元素上存取数据,返回设置值。

提示: 1.这是一个底层方法,.data() 方法更方便使用。 
2.通过 data() 函数存取的数据都是临时数据,一旦页面刷新,之前存放的数据都将被移除。 
3. 该方法目前并不提供在XML文档上跨平台设置,Internet Explorer不允许在XML文档中通过自定义属性附加数据。

注意: 1.通过data()函数存取的数据都是临时数据,一旦页面刷新,之前存放的数据都将被移除。
2. undefined 是一个没有被识别数据值。调用 jQuery.data( el, "name", undefined ) 将返回对应的 "name" 数据,等价于 jQuery.data(el, "name" ) 。

我们可以在一个元素上设置不同的值,并获取这些值:
alert(jQuery.data( document.body, 'foo' ));
alert(jQuery.data( document.body ));

6、on

$(selector).on(event,childSelector,data,function)

这里主要是讲其中 childSelector的作用,

on()委托事件的优点:原来的事件绑定,要绑定好多事件,现在只需要绑定一个事件,大大提高了效率和页面性能,解决的动态添加元素导致不能触发的bug。

Jq1.7+开始支持。

posted @ 2017-05-27 10:18  ypm_wbg  阅读(211)  评论(0编辑  收藏  举报