转来进修一下 jQuery中不为人知的的几个要领
jQuery近些年来依旧是web开辟中最受欢迎的类库,虽然人人褒贬不一,然则依旧不失为一款最盛行的Javascript,在本日这篇文章中,我们将引见几个jQuery的相干要领,不管你是入门级极客或许骨灰级极客,可以都邑疏忽这些要领的运用。愿望人人会以为有协助!
在事宜中return false
可以人人在编写事宜相干代码的时刻,有时刻会运用return false语句,代码以下:
$("a").click(function() {
$(".gbtags").toggle();
return false;
}
以上代码中,我们点击a元素,假如不return false,会触发对应a元素的链接,致使页面的地点变化。
而jQuery有规范的要领来协助你完成相似上面的功用,代码以下:
if ( ret !== undefined ) {
if ( (event.result = ret) === false ) {
event.preventDefault();
event.stopPropagation();
}
}
那末这两个完成体式格局有什么差别呢? 我们可以看看jQuery的源代码,以下:
if ( ret !== undefined ) {
if ( (event.result = ret) === false ) {
event.preventDefault();
event.stopPropagation();
}
}
人人看邃晓了吗?最简朴明白,以下:
return false;
即是
event.preventDefault();
event.stopPropagation();
在事宜处置惩罚中,假如你直接返回false,那末将会同时阻挠元素缺省行动而且停止元素事宜的Bubbling,即事宜同时阻挠当前元素父层元素,即:event.stopPropagation(); 所完成效果。
$.type来完成范例推断
或许人人都已习惯了运用javascript的当地要领:typeof 来推断范例,然则在jQuery中供应了一个更好的要领协助你推断范例,那就是$.type。
那末终究有什么区别呢? 我们先看看这个gbdebug:
http://www.gbtags.com/gb/debug/3361dbff-41c0-465d-81e3-1ef6cbb275e1.htm
运转以上代码,能看到以下输出效果:
// 返回object
result(typeof null);
// 返回object
result(typeof [0, 1, 2]);
// 返回object
result(typeof new Number(3));
// 返回null
result($.type(null));
// 返回array
result($.type([0, 1, 2]));
// 返回number
result($.type(new Number(3)));
人人看出来什么区别了吗? 运用$.type可以返回更正确的对象范例,而typeof则返回object,所以假如你运用jQuery来编码的时刻,运用$.type 将越发轻易。
运用attr()来完成removeAttr()的功用
可以人人习惯了运用attr()来增加元素属性,而运用removeAttr() 来删除元素属性。
然则实在运用attr()也能实行删除的效果,为何呢?请看看以下jQuery源代码:
attr: function( elem, name, value ) {
...
if ( value !== undefined ) {
if ( value === null ) {
jQuery.removeAttr( elem, name );
...
}
从上面jQuery的源代码中可以看出来,假如你设置value为null的话,实在它就可以完成removeAttr的要领功用。
http://www.gbtags.com/gb/debug/269c89e1-b22f-40f9-8d26-8d995e999d29.htm
因而,我们可以以下体式格局来运转推断是不是删除属性:
$('a').attr('title', condition ? value : null);
不然你须要运用以下:
condition ? $('a').attr('title', value) : $('a').removeAttr('title');
是不是是轻微简朴一些?
$.makeArray来建立数组
有些时刻我们须要将相似数组的数据结构转化成为一个实在的数组,然后挪用相干数组要领,比方reverse,代码以下:
// 返回 NodeList
var elems = document.getElementsByTagName( "li" );
// 转化为Array
var arr = jQuery.makeArray( elems );
// 挪用数组要领反向排序
arr.reverse();
$( arr ).appendTo( document.body );
相干gbdebug:
http://www.gbtags.com/gb/debug/75d28491-aa13-4868-aa95-10b079337b82.htm
是不是是异常简朴?假如不运用$.makeArray,那末你须要本身处置惩罚Javascript来完成相似的功用,会异常贫苦
总结
以上就是几个人人可以在jQuery开辟中轻易疏忽的几个有用要领,或许你也有本身的一些不错的要领,请人人不吝分享!