首页 > 代码库 > JQuery其他常用函数

JQuery其他常用函数

2024-08-06 11:30:23   221人阅读

isArray(obj)                      检测obj否为一个数组对象

isFunction(obj)                 检测obj否为一个函数

isEmptyObject(obj)          检测obj否为一个空对象

isPlainObject(obj)            检测obj否为一个纯粹对象（是否是通过{}或new                                                      Object()关键字创建的）

contains(container,contained)检测一个DOM节点是否包含另一个DOM节点

data()函数

$(selector).data(name,value)        向被选元素附加数据

$(selector).data(name)                  从被选元素中返回附加的数据

$(selector).data(object)                 使用带有名称/值对的对象向被选元素添加数据

向元素附加数据，然后取回该数据：

[javascript] view plaincopyprint?
  1. $("#btn1").click(function(){  
  2.   $("div").data("greeting","Hello World");  
  3. });  
  4. $("#btn2").click(function(){  
  5.  alert($("div").data("greeting"));  
  6. });  


 

从元素中删除之前添加的数据：

[javascript] view plaincopyprint?
  1. $("#btn2").click(function(){  
  2.   $("div").removeData("greeting");  
  3.   alert("Greeting is: " +$("div").data("greeting"));  
  4. });  

 

map()函数

map(array,function(elementOfArray,indexOfArray))

grep是过滤数组中的元素，map是按指定要求修改数组中的所选元素

将一组元素转换成其他数组（不论是否是元素数组);

[javascript] view plaincopyprint?
  1. <p><b>Values:</b></p>  
  2. <form>  
  3.   <input type="text"name="name" value=http://www.mamicode.com/"John"/>  
  4.   <input type="text"name="password" value=http://www.mamicode.com/"password"/>  
  5.   <input type="text"name="url" value=http://www.mamicode.com/"http://ejohn.org/"/>  
  6. </form>  
  7.    
  8. exampl:  
  9.    
  10. $("p").append($("input").map(function(){  
  11.   return $(this).val();  
  12. }).get().join(",") );  
  13. result:  <p>John, password, http://ejohn.org/</p>  
  14.    
  15. $.map(attr,function(ele,index){  
  16.       if(ele>5&&index<8){  
  17.              return ele+1;  
  18.       } //将数组中元素值大于5并且序号小于8的元素加1  
  19. });  


 

$.param()函数

$.param(object,[traditional])

object表示要被序列化的对象，该对象可以是数组、JQuery对象、普通对象

traditional表示是否通过普通的方式浅层序列化，返回序列化后的字符串

[javascript] view plaincopyprint?
  1. var myObject = {  
  2.   a: {  
  3.     one: 1,  
  4.     two: 2,  
  5.     three: 3  
  6.   },  
  7.   b: [1,2,3]  
  8. };  
  9. varrecursiveEncoded = $.param(myObject);  
  10. varrecursiveDecoded = decodeURIComponent($.param(myObject));  
  11.    
  12. alert(recursiveEncoded);  
  13. alert(recursiveDecoded);  
  14.    


recursiveEncoded和 recursiveDecoded 的值输出如下：

a%5Bone%5D=1&a%5Btwo%5D=2&a%5Bthree%5D=3&b%5B%5D=1&b%5B%5D=2&b%5B%5D=3

a[one]=1&a[two]=2&a[three]=3&b[]=1&b[]=2&b[]=3

 

如果被传递的对象在数组中，则必须是以.serializeArray() 的返回值为格式的对象数组

[

  {name: ‘firstname‘, value: ‘Hello‘},

  {name: ‘lastname‘, value: ‘World‘},

  {name: ‘alias‘}, // 值为空

]

$.proxy()函数

接受一个函数，然后返回一个新函数，并且这个新函数始终保持了特定的上下文(context )语境，这个方法通常在向一个元素上附加事件处理函数时，上下文语境实际是指向另一个对象的情况下使用。

 

另外，jQuery 能够确保即使你绑定的函数是经过 jQuery.proxy() 处理过的函数，你依然可以用原先的函数来正确地取消绑定。

jQuery.proxy(function, context )

function将要改变上下文语境的函数。

context函数的上下文语境(`this`)会被设置成这个object 对象。

 

jQuery.proxy(context, name )

context函数的上下文语境会被设置成这个 object 对象。

name将要改变上下文语境的函数名(这个函数必须是前一个参数 ‘context’ 对象的属性)

var objMyInfo = {

      name : “clf”,

      sex : “男”,

      ShowEvent : function(){

             alert(this.name+”****”+this.sex);

      }

}

 

$(“#bnt”).bind(“click”,$.proxy(objMyInfo.ShowEvent,objMyInfo));

如果不用proxy函数，则出发click 事件时，调用objMyInfo.ShowEvent函数，此函数内的this关键字将指向非objMyInfo上下文，那么，this.name和this.sex都将是一个undifined的变量

$.trim(“  text  ”)

去除字符前后的空格

$.support

浏览器检测函数

boxModel: 如果这个页面和浏览器是以W3CCSS盒式模型来渲染的，则等于true。通常在IE 6和IE 7的怪癖模式中这个值是false。在document准备就绪前，这个值是null。

cssFloat: 如果用cssFloat来访问CSS的float的值，则返回true。目前在IE中会返回false,他用styleFloat代替。

hrefNormalized: 如果浏览器从getAttribute("href")返回的是原封不动的结果，则返回true。在IE中会返回false，因为他的URLs已经常规化了。

htmlSerialize: 如果浏览器通过innerHTML插入链接元素的时候会序列化这些链接，则返回true，目前IE中返回false。

leadingWhitespace: 如果在使用innerHTML的时候浏览器会保持前导空白字符，则返回true，目前在IE 6-8中返回false。

noCloneEvent: 如果浏览器在克隆元素的时候不会连同事件处理函数一起复制，则返回true，目前在IE中返回false。

objectAll: 如果在某个元素对象上执行getElementsByTagName("*")会返回所有子孙元素，则为true，目前在IE 7中为false。

opacity: 如果浏览器能适当解释透明度样式属性，则返回true，目前在IE中返回false，因为他用alpha滤镜代替。

scriptEval: 使用appendChild/createTextNode 方法插入脚本代码时，浏览器是否执行脚本，目前在IE中返回false，IE使用 .text 方法插入脚本代码以执行。

style: 如果getAttribute("style")返回元素的行内样式，则为true。目前IE中为false，因为他用cssText代替。

tbody: 如果浏览器允许table元素不包含tbody元素，则返回true。目前在IE中会返回false，他会自动插入缺失的tbody。

JQuery其他常用函数


联系
我们