jQuery技巧大放送.pdf

jQuery技巧大放送.pdf jQuery技巧大放送.pdf$("msg").css({ color:"red", background:"blue"});//以名值对的形式设定样式$("#msg"). addclass(" select");//为元素增加名称为 select的 class$("msg"). removeClass(" select");//删除元素名称为 select的 class$("#msg"). toggleclass(" select");//如果存在(不存在)就删除(添加)名称为 select的 class、完善的事件处理功Jquery已经为我们提供了各种事件处理方法,我们无需在htm1元素上直接写事件,而可以直接为通过 Jquery获取的对象添加事件。$("#msg”). click( function({ alert("good")})//为元素添加了单击事件$("p"). click( function(i){this. style. color=[#f00’,”#0f0’,”#00『][i]//为三个不同的p元素单击事件分别设定不同的处理uery中几个自定义的事件(1) hover(finl,fn2):一个模仿悬停事件(鼠标移动到一个对象上面及移岀这个对象)的方法。当鼠标移动到一个匹配的元素上面时,会触发指定的第一个函数。当鼠标移出这个元素时,会触发指定的第二个函数//当鼠标放在表格的某行上时将 class置为over,离开时置为out。$(tr ) hover(function(s(this). addClass ("over")function((s(this). addClass("out")(2) ready(fn)∷当DOM载入就绪可以查询及操纵时绑定一个要执行的函数s(document). ready(function alert( Load Success )))//页面加载完毕提示“ Load success”,相当于 onload事件。与$(fn)等价(3) toggle( evenT,odFn):每次点击时切换要调用的函数。如果点击了一个匹配的元素,则触发指定的第一个函数,当再次点击同一元素时,则触发指定的第二个函数。随后的每次点击都重复对这两个函数的轮番调用//每次点击时轮换添加和删除名为 selected的 class。$(p). toggle(function IS(this). addClass("selected")1, function is(this). removeClass("selected")})(4) trigger( eventtype):在每一个匹配的元素上触发某类事件。例如:$("p"). trigger(" click");/)触发所有p元素的 click事件(5)bind( event type,fn), unbind( event type):事件的绑定与反绑定从每一个匹配的元素中(添加)删除绑定的事件例如:$("p").bind(" click", function0){ alert($(this).text0);});//为每个p元素添加单山事件$("p"). unbind;/删除所有p元素上的所有事件$("p"). unbind("cick")//删除所有p元素上的单击事件0、几个实用特效功其中 toggle和 slidetoggle(方法提供了状态切换功能如 toggle方法包括了hide(和show0方法。slideloggle o方法包括了 slideDownO和 slider方法1、几个有用的 jQuery方法$. browser.浏览器类型:检测浏览器类型。有效参数: safari, opera,msie, zilla。如检测是否ie:$. browser.isie,是ic浏览器则返回true$.each(obj,fn):通用的达代函数。可用于近似地达代对象和数组(代替循环)。如S each( [0, 1, 2], function (i, n)i alert("Item #"+i +:-n):)等价」:var tempArr-[O, 1, 2]for(var i=0: i0? i t 1 null:tempEr内容为:|2,3$. merge(arr1,arr2):合并两个数组并删除其中重复的项日如:$. merge([0,1,2],[2,3,4])//返回0,1,2,3,4]$.trim(str):删除字符串两端的空白字符。如:$.trim(" hello, how are you?");//返回" hello, how are you?L2、解决自定义方法或其他类库与 jQuery的冲突很多时候我们自己定义了S(id)方法来获取一个元素,或者其他的一些js类库如 prototype也都定义了$方法,如果同时把这些内容放在一起就会引起变量方法定义冲突, Jquery对此专门提供了方法用于解决此问题使用 Jquery中的 jQuery. coNflict0;方法即可把变量$的控制杖让渡给第个实现它的那个库或之前自定义的$方法。之后应用 jquery的时候只要将所有的$换成 jQuery即可,如原来引用对象方法$("#msg")改为 jQuery("#msg")。如:jQuery. noConflicto//开始使用 jQueryjQuery( div p" ). hideo使用其他库的$0s( content) style. display =none