你的位置:快乐忆站 \ 前端 \ 文章正文

jQuery升级到1.9.0的几点建议

jQuery1.9.0发布已经好久了吧,大概是1月15日发布的,一发布就听微博上有人说,此次升级会死掉大批插件,因为jQuery1.9.0移除了很多用的较多的api,纠结了很久,还是决定倒腾下,升级本站的jQuery到最新的1.9.0。可能官方也是知道此次升级较大改动,官方也出了文档和插件,帮助用户升级,这个很赞。官方的升级指南:http://jquery.com/upgrade-guide/1.9/(英文)

上面说到的官方插件是一个集检测和兼容于一体的插件,官方说明文档:https://github.com/jquery/jquery-migrate/#readme,对于只想简单升级内核,不想更改原有代码的童鞋来说,你只需要升级jQuery到最新的1.9.0,然后在其后引入官方的jquery-migrate插件,这样你就能最方便的无缝升级到jQuery1.9.0,此插件会报告你现有代码中的存在兼容性问题的代码,并在控制台以警告显示,如图:

警告信息

相当有人性的插件,不得不佩服jQuery官方的态度,国内的很多开源软件是没法做到的!

但是,也有童鞋不愿意额外去引入这个插件,比如说我,貌似有代码洁癖,没用的,一概不想出现在页面上,也许是职业病吧。不想引入,怎么升级到最新版呢?办法只有一个,参照jQuery给出的升级指南,找到现有代码中所有改动的api,重写这部分改动过的部分以兼容新版。我说说我自己碰到的升级的问题及一些解决方案。

1.attr,如果像是取‘checked’或者‘readonly’这种属性,请换成prop,官方建议这样,举个例子:

$('checkbox').attr('checked', 'checked'); //不推荐
$('checkbox').prop('checked', true); //推荐

2.hover,这个用的非常多,但是不知为啥,官方去掉这个方法,建议用“mouseenter mouseleave”代替,举个例子:

$('body').hover(function, function); //旧
$('body').on({'mouseenter': function, 'mouseleave': function}); //新

3.toggle,这个指的是.toggle(function, function, ... ),不是控制一个元素隐藏显示的那个方法,不要误解。这个要根据自己的条件跟方法去找到替代的方法,这里就不举例子了。

4.jQuery.browser(),这个现在是直接被干掉了,建议用其他第三方的检测浏览器的库或者通过原生的navigator.userAgent来判断,这里推荐用Modernizr,非常专业,非常强大,不仅仅是浏览器,还有更多请自行发掘。不想引入整个库的可以根据自己的需要自行下载部分源码,地址:http://modernizr.com/download/

5.live/die,这个api之前用来动态绑定和解绑的,在jQuery1.9.0后,其被删除了,直接用“on/off”替换源码里面的live即可。

6.$(html),这里的‘html’必须以“<”开头,否则要报错,其他的字符应该不太会有,就怕有空格,我这里的解决方案是使用$.trim()处理下“html”。

7.AJAX事件只能绑定在document上,不能再绑定到元素上,举个例子:

$("#status").ajaxStart(function(){ $(this).text("Ajax started"); }); //旧
$(document).ajaxStart(function(){ $("#status").text("Ajax started"); }); //新

好了,差不多了,还有一些不太常用的如果你用了,就参照官方的升级指南去改吧。有任何建议或异议,请留言,咱探讨下。好久不写这种文章,好累啊。。。洗洗睡了。。。

貌似被百度降权了,有介意的友链可以在通知我的前提下单方面把链接撤掉,谢谢!等新皮肤出来,考虑换域名了,这个域名没啥前途了。。。

« 上一篇

说两句吧:

*

*

正在回复: 取消

  1. 34#
    子撑父菊
    子撑父菊 Google Chrome 55.0.2883.87 Windows 7 x64 Edition 2017-10-02 14:39 回复
    不错不错
  2. 33#
    足球比分
    足球比分 Firefox 53.0 Windows 2017-06-02 23:07 回复
    学习学习。。。
  3. 32#
    浮夸
    浮夸 Google Chrome 21.0.1180.60 Windows 7 2013-07-20 22:30 回复
    jQuery通俗点讲,到底是干啥用的啊?
    小松
    小松 Mobile Google Chrome  iPhone iOS 6.1.2 2013-07-21 07:42 回复
    @浮夸:一个封装好了的js类库,方便使用js
  4. 31#
    温室大棚
    温室大棚 Maxthon 3.0 Windows 7 2013-04-26 20:35 回复
    主题挺有特点呵呵
  5. 30#
    cheap jersey
    cheap jersey Firefox 20.0 Windows XP 2013-04-25 09:11 回复
    本站的模板的特点是 刚开始看的时候 会很不习惯,但是看久了 发现其实还是挺好用的
  6. 29#
    阿修
    阿修 Firefox 19.0 Windows 7 2013-04-10 17:33 回复
    看了正文表示头晕。完全不懂的技术小白。
    看了评论更晕,瀑布流有点伤不起,感觉有点混乱。
    我个人是比较排斥瀑布流的。
    小松
    小松 Google Chrome 26.0.1410.64 Windows 8 x64 Edition 2013-04-10 18:15 回复
    @阿修:评论的瀑布流确实不咋地,不过我已经懒得再去修改了
  7. 28#
    rambo
    rambo Google Chrome 24.0.1312.70 GNU/Linux 2013-03-27 17:17 回复
    1:andself更换为andback      
    2:允许设置 $(“input”).attr(“type”, newValue) 只要你敢保证在ie67以上版本使用
    3: 添加html里 script代码的处理  1.9处理并保留
    4: .data 的严禁   以前 data(abc.r)  abc即可取到  1.9后 必须使用 abc.f
    5:.after(), .before(), 和 .replaceWith()使用脱离文档的节点  这点有点不是太明白 所以就不说自己的理解了 还请楼主补上这点
    小松
    小松 Google Chrome 26.0.1410.43 Windows 8 x64 Edition 2013-03-27 18:47 回复
    @rambo:吸纳了,谢谢你的提醒
  8. 27#
    阿邙
    阿邙 Firefox 19.0 Windows 7 x64 Edition 2013-03-23 23:04 回复
    旧的还没玩太明白,就又升级了。。
    小松
    小松 Mobile Google Chrome  iPhone iOS 6.1.2 2013-03-24 10:12 回复
    @阿邙:要与时俱进啊!
    低手
    低手 Google Chrome 30.0.1599.69 Windows 8 x64 Edition 2013-10-12 15:58 回复
    @小松:主要是感觉更新的有点不合理!!!
    小松
    小松 Google Chrome 30.0.1599.69 Windows 8 x64 Edition 2013-10-14 09:19 回复
    @低手:为啥不合理?
  9. 26#
    黎健雄
    黎健雄 Google Chrome 25.0.1364.152 Windows XP 2013-03-21 21:42 回复
    听说这里支持ajax无刷新评论。
    小松
    小松 Mobile Google Chrome  iPhone iOS 6.1.2 2013-03-21 22:40 回复
    @黎健雄:哈哈,测试出来了吗?
  10. 25#
    汽枪图片
    汽枪图片 Maxthon 3.0 Windows 7 2013-03-05 14:35 回复
    对这个没什么研究 围观一下
1 2 3 4

随机日志:

推荐日志:

彩色标签:

sitemap