您的位置：首页 > Web前端 > JQuery

jQuery实用工具类--jQuery基础知识点(3)

2014-11-25 23:47 281 查看

在jQuery中，实用工具是指直接依附于jQuery对象，针对jQuery对象本身定义的方法，即全局性的函数。

可分为几大类别：浏览器的检测、数组和对象的操作、字符串操作、测试操作、URL操作。

调用方式：$.函数名() 或 jQuery.函数()

1. $.browser对象即jQuery.browser对象，用于处理与浏览器相关的事物。


$.browser.webkit

Google chrome

$.browser.mozilla

Mozilla Firefox

$.browser.safari

Apple Safari

$.browser.opera

OPERA Opera

$.browser.msie

Microsoft MSIE(Microsoft Internet Explorer)

$.version

返回当前浏览器的版本号（内核版本号）

PS：在1.3版本中已经 被jQuery.support函数替代

2. 盒子模型，用以描述页面设置中的各种属性，如内容（content）、填充（padding）、边框（border）、边界（margin）。

一类是W3C盒子模型；一类是IE盒子模型。两者根本区别在于属性height和width这两个值是否包含padding与border。

W3C盒子模型不包含padding和border。

jQuery.support.boxModel //true：W3C盒子模型

声明DOCTYPE类型，使用标准的W3C盒子模型
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
3. 遍历数组：$.each(obj,fn(para1,para2))

其中，参数obj表示要遍历的数组或对象，fn为每个遍历元素执行的回调函数，该函数包含两个参数：para1表示数组的序号或对象的属性；para2表示数组的元素和对象的属性值。

4. 筛选数组中的元素：$.grep(array,function(elementOfArray,indexInArray),[invert])

其中，elementOfArray为数组中的元素；indexInArray为元素在数组中的序列号；invert=false不取反。

例：$.grep(arrNum,function(ele,index){

return ele>5 && index<8; //元素值大于5且序号小于8

})

5. 按指定条件修改数组中的所选元素：$.map(array,callback(elementOfArray,indexInArray))

其中，elementOfArray为数组中的元素；indexInArray为元素在数组中的序列号。

例：$.map(arrNum,function(ele,index){

if(ele>5 && index<8){ //元素值大于5且序号小于8

return ele+3;

}

})

6. 在数组中搜索某个元素，可以使用工具函数$.inArray()

该方法相当于javascript中的indexOf()函数搜索字符串中的某个字符

找到指定元素，返回对应索引号，否则返回-1。

var arr = [2,9,2];

$.inArray(2,arr); //0

$.inArray(2,arr,1); //2

$.inArray(2,arr,3); //-1

7. 测试工具函数：

$.isArray(obj)

$.isFunction(obj)

$.isEmptyObject(obj)

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

8. URL操作；

serialize()方法来序列化表单向服务器提交数据，即URL操作，而该方法的核心则是工具函数$.param()。

通过该工具函数可以使数组或jQuery对象按照key/value的格式进行序列化。

$("#formID").serialize()

$.param(obj,[traditional])

var arrScore = { Score: { chinese: 90, maths: 100, english: 98 },
SunNum: { Score: 288, Num: 3 }};
$.param(arrScore)  //Score%5Bchinese%5D=90&Score%5Bmaths%5D=100&Score%5Benglish%5D=98&SunNum%5BScore%5D=288&SunNum%5BNum%5D=3
encodeURIComponent(arrScore)  //%5Bobject%20Object%5D  不能通过此方式进行序列话
var arrDecScore = decodeURIComponent($.param(arrScore)); //Score[chinese]=90&Score[maths]=100&Score[english]=98&SunNum[Score]=288&SunNum[Num]=3
10. $.proxy()在处理不同作用域对象事件时相当实用，其返回一个新的函数。

11. $.extend(target,obj1,...[obj2]) target表示合并后的对象。存在相同参数的名称，后面对象中的参数值将覆盖前面对象中的参数值
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航