首页 > 网站 > WEB开发 > 正文

【jQuery】DOM无关的jQuery实用函数

2024-04-27 15:09:09
字体:
来源:转载
供稿:网友

一、使用jQuery标志 1、禁用动画 $.fx.off——启用或者禁用特效,是一个可读写的标志,其余的预定义标志是只读的。 2、检测用户代理支持 浏览器检测和特征检测 jQuery浏览器功能标志 $.support浏览器功能标志: boxModel/CSSFloat/hrefNormalized/htmlSerialize/leadingWhitespace/noCloneEvent/objectAll/opacity/scriptEval/style/tbody 3、浏览器检测标志 在只能使用浏览器检测的情况下,可以使用标志,在加载库时被创建,并被定义为通过$.browser引用的对象实例的属性。 标志: msie:如果用户代理被识别为任意版本的IE浏览器,则设置为true mozilla:如果用户代理被识别为任意基于Mozilla的浏览器,则设置为true safari:如果用户代理被识别为任意基于WebKit浏览器,则设置为true Opera:如果用户代理被识别为opera浏览器,则设置为true version:设置为浏览器渲染引擎的版本号 二、jQuery与其他库并存 $.noConflict()jqueryToo——将标识符$的控制权归还给其他库,允许在页面上混合使用jQuery与其他库。 创建一个作用域环境,在该环境中$标识符指向jQuery对象。用法为:

(function($){……})(jQuery);

三、操作javascript对象和集合 1、修剪字符串 $.trim(value)——删除传入的字符串开头和结尾处的空白字符,并返回修改后的结果。这个函数中的空白字符定义为:匹配Javascript正则表达式/s的任意字符,不仅匹配空白字符,而且匹配换页、换行、回车、制表,以及垂直制表符,还包括Unicode字符/u00A0。 2、遍历属性和集合 $.each(container,callback)——遍历传入的容器中的每一项,并为每一项调用传入的回调函数 回调函数的第一参数是数组元素的下标或对象属性的名称;第二个参数是数组项或者属性值。将传入的第二个参数的值设置为调用函数的山下文(this)。 例:

var anArray=[‘one’,’two’,’three’];$.each(anArray,function(n,value){……});var anObject=[one:1,two:2,three:3];$.each(anObject,function(name,value){……});

3、筛选数组 $.grep(array,callback,invert)——遍历传入的数组,为每个元素调用回调函数。 callback——回调函数的返回值决定是否收集当前数据值。返回true,则收集。这个函数接收两个参数,当前数据值和其在原始数组中的下标。 invert`——如果设置为true,回调函数返回false将导致数据被收集。如果省略或设置为false,回调函数返回true将导致数据被收集。 例:

var bigNumbers=$.grep(originalArray,function(value){ return value>100;});var badZips=$.grep( originalArray, function(value){ return value.match(/^/d{5}(-/d{4})?$/) !=null; //间接使用正则表达式},true);

4、转换数组 $.map(array,callback)——遍历传入的数组,为数组的每一项调用回调函数,并将函数调用的返回值收集到一个新的数组中。 例:

var strings=[‘1’,’2’,’3’,’S’,’6’];var values=$.map(strings,function(value){ var result=new Number(value); return isNaN(result) ? null : result;});

5、其他 $.inArray(value,array)——返回传入的值第一次出现时的下标 例:var index=$.inArray(2,[1,2,3,4,5]); $.makeArray(object)——将传入的类似数组的对象转换为Javascript数组。 类似数组:拥有长度和下标项概念的任何对象 比如Nodelist,var images=document.getElementByTagName(‘img’) $.unique(array)——向其传入DOM元素的数组,则返回由原始数组中不重复的元素组成的数组 $.merge(array1,array2)——将第二个数组中的值合并到第一个数组中并返回结果。这个操作会修改第一个数组并将其作为结果返回。 6、扩展对象 模拟继承:通过将基础对象的属性复制到新对象来扩展对象,使得扩展的新对象拥有基础对象的功能 $.extend(deep,target,source1,source2,…,sourceN)——使用其余传入的对象的属性来扩展传入的target对象 deep——(布尔)可选,为true,执行深复制,省略或false,执行浅复制 target——对象,在作为函数值返回之前,这个对象会直接被新属性所修改。任何与源元素中的属性具有相同名称的属性,都会被来自源元素的值所覆盖。 7、序列化参数值 $.param(params,traditional)——将传入的信息序列化成可在提交请求中使用的查询字符串。查询字符串将会被正确地进行格式化,并且字符串中的每个名称和值都会被正确地进行URI编码。 params——(数组|jQuery|对象)需要序列化为查询字符串的值 如果传入的是元素数组或jQuery包装集,则其中包括的表单控件的名称/值对会被添加到查询字符串中。如果传入的是一个javascript对象,则对象的属性形成了参数的名称和值。 traditional——如果设置为true,则强制此函数按照jQuery1.4之前的算法来执行;如果省略即为false 例:

$.param({ ‘a thing’: ’it&s=value’, ‘another thing’: ’another value’, ‘weird characters’: ‘!@#$%^&*()_+=’});

则返回的是: a+thing=it%26s%3Dvalue&another+thing=another+value&weird+characters=!%40%23%24%25%5E%26*()_%2B%3D 序列化嵌套参数 嵌套对象:

{ name:{ first:’Yogi’, last:’Bear’},address:{ street:’123’, city:’Austin’}}

这样的结构可以表示为:name[first]=Yogi&name[last]=Bear&address[street]=123&…… 8、测试对象 $.isArray(o)——如果o是javascript数组,则返回true;否则为false $.isEmptyObject(o)——如果o是不包含属性的javascript对象,则返回true,这里指的属性包括任何PRototype继承下来的属性 $.isFunction(o)——如果o是javascript函数,则返回true。注:在IE浏览器中,内置的函数如alert()以及元素方法都不能被正确报告为函数 $.isPlainObject(o)——如果o是一个通过{}或者new Object()创建的javascript对象,则返回true $.isxmlDoc(o)——如果node是XML文档,或者是文档里的节点,则返回true 四、其他实用函数 1、什么都不做

$.noop()

在用户没有提供回调函数时作为其默认值用的 2、测试包含关系 $.contains(container,containee)——测试一个元素是否在DOM层次结构中包含在另一个元素内部。如果containee包含在container内部就返回true,否则返回false。 3、附加数据到元素上 $.data(element,name,value)——使用指定的名称在传入的元素上存储或者检索数据 element——(元素)用于存储数据的或者从中检索数据的DOM元素 name——(字符串)与数据相关联的名称 value——(对象)将要被赋值给指定名称的元素的数据。如果省略,则获取指定名称的数据 $.removeData(element,name)——删除存储在传入的元素上的数据 4、预绑定函数上下文

$.proxy(function,proxy)

$.proxy(proxy,property)——使用预绑定的代理对象创建函数的一个副本,在函数作为回调函数被调用时,此对象作为函数的上下文 function——将要使用代理对象来预绑定的函数 proxy——将要绑定为代理函数上下文的对象 property——传入的proxy对象的属性名称,包含将要绑定的函数 例:

$(‘#testButton,#buttonContainer’).click( $.proxy(function(){say(this.id);}, $(‘#controlPanel’)[0]));

5、解析JSON $.parseJSON(json)——解析传入的JSON字符串,返回其计算值 6、表达式求值 $.globalEval(code)——在全局上下文中对传入的javascript代码进行求值 7、动态加载脚本 $.getScript(url,callback)——通过向指定的服务器发起GET请求来获取由url参数指定的脚本,在请求成功后调用回调参数 例:stuff.js文件内容为:

alert(‘I’m inline’);var somevalue=’value of somevariable’;function somefunction(value){alert(value);};

主程序为:

$(function(){ $(‘#but1’).click(function(){ $.getScript( ‘stuff.js’ //,function(){$(‘#btn2’).click()});});$(‘#btn2’).click(function(){ someFunction(somevariable);});});
发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表