jQuery中不为人知的的几个方法

转来学习一下 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开发中容易忽略的几个实用方法，或者你也有本身的一些不错的方法，请你们不吝分享！