jQuery中大家不太了解的几个方法

2024-04-03 19:21:05 35

jQuery近些年来仍旧是web开发中最受欢迎的类库，虽然大家褒贬不一，但是仍旧不失为一款最流行的Javascript，

在事件中returnfalse

可能大家在编写事件相关代码的时候，有时候会使用returnfalse语句，代码如下：


$("a").click(function(){

  $(".gbtags").toggle();

  returnfalse;

}

以上代码中，我们点击a元素，如果不returnfalse，会触发对应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();

  }

}

大家看明白了吗？最简单理解，如下：

returnfalse;
等于

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(typeofnull);

//返回object

result(typeof[0,1,2]);

//返回object

result(typeofnewNumber(3));

//返回null

result($.type(null));

//返回array

result($.type([0,1,2]));

//返回number

result($.type(newNumber(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

varelems=document.getElementsByTagName("li");

//转化为Array

vararr=jQuery.makeArray(elems);

//调用数组方法反向排序

arr.reverse();

$(arr).appendTo(document.body);

jQuery中大家不太了解的几个方法

热门推荐

随机推荐