jquery的使用现在变得越来越普遍,write less ,do more的宗旨贯穿了整个jquery开发。jquery虽然用着方便,但是,使用它还是应该把握技巧的,其实和使用原生js一样,我们也需要掌握相应的优化策略,要想正确的优化jquery开发代码,很有必要了解一下jquery的内核,简单点说就是jquery的实现方法,我们都知道,jquery的初衷就是做一个完美的dom选择器,因此最近我通过对jquery内核的学习,并且通过对jquery和js源码实现的方法作对比,对比实现的代码在附件中,代码运行后显示的效果充分证明了js源码和jquery方法的效率比较,在这里粘一张图:
具体的比较大家可以看源码,下面是一些优化建议:
1、尽量使用原生选择器
2、id原生 > $(id原生) > $()
3、尽量多使用id选择器
4、在class选择符字符转前加上标签名能够大大提升效率
5、选择符标签数越少越好
6、使用$(1).find(2)的选择格式时,若1为标签名,则会大大降低选取效率
7、如果需要对元素使用jquery的一些效果,最好使用原生选取元素然后再转为jquery对象
8、尽量使用id选择器
9、多标签选取尽量使用class选择器,多组选择器的效率比较低
10、多多使用find
11、尽量使用原生方法实现元素的创建、添加、属性的添加和修改
12、如果使用jquery的attr创建属性,最好使用$()直接选取元素
13、当使用原生的innerHTML时,如果字符传中没有标签,innerHTML最好,如果有,最好使用createElement,和appendChild结合插入元素
另外说一个很多人都容易忽视的问题:
移除元素最好使用jquery的方法,因为,jquery在移除元素前有一个事件绑定的清除操作,这有助于降低内存,使网页性能更好,具体原因,大家可以看:http://hi.baidu.com/flondon/item/489653102185ee9a98ce336f
里面有详细的说明。在这里也谢谢博主了。
这些是我个人经验,有什么错误欢迎大家批评指正
相关推荐
**jQuery前端开发技术** jQuery,一个轻量级、高性能的JavaScript库,自2006年发布以来,因其简洁易用的API而深受开发者喜爱。它极大地简化了HTML文档遍历、事件处理、动画制作以及Ajax交互等任务,使得前端开发变...
虽然随着现代Web开发框架(如React、Vue和Angular)的兴起,jQuery的使用频率有所下降,但它仍然是学习前端开发的重要一环。 ### jQuery的主要特点 1. **链式调用**:通过返回自身对象的方式,使得多个方法可以...
**jQuery:前端开发的核心工具** jQuery,作为一款强大的JavaScript库,极大地简化了JavaScript的DOM操作、事件处理、动画设计和Ajax交互。它以其简洁、直观的API和广泛的浏览器兼容性,成为了前端开发者不可或缺的...
《疯狂前端开发讲义——jQuery+AngularJS+Bootstrap前端开发实战》是一本深入浅出的前端开发教程,它涵盖了三个核心的前端技术:jQuery、AngularJS和Bootstrap。这些技术在现代网页开发中扮演着至关重要的角色,使得...
《jQuery Web开发案例教程(在线实训版)》案例源码.zip是一个包含丰富的jQuery实践案例的压缩包,旨在帮助学习者深入理解和应用jQuery库在Web开发中的功能和技巧。这个资源对于初学者和有一定经验的开发者来说都是...
**jQuery前端验证框架详解** 在Web开发中,前端验证是必不可少的一个环节,它能有效防止无效数据提交到服务器,提高用户体验并减轻服务器负担。jQuery,作为一款广泛使用的JavaScript库,提供了许多工具和插件来...
《疯狂前端开发讲义:jQuery+AngularJS+Bootstrap前端开发实战》是一本专注于前端开发的实践教程,由知名IT作者李刚编著。本书旨在帮助读者深入理解和掌握前端三大热门框架——jQuery、AngularJS和Bootstrap的使用...
《jQuery 前端开发实战教程》主要涵盖了jQuery的基础...以上内容只是《jQuery 前端开发实战教程》部分知识点的概述,实际教程中可能还包括更多细节和实践案例,旨在帮助开发者深入理解和熟练使用jQuery进行前端开发。
本资源“javascript& jQuery 交互式Web前端开发 高清版本”提供了高质量的教材,适合那些想要深入理解这两种技术的开发者。 JavaScript,一种在浏览器端运行的脚本语言,是Web开发的基础。它允许开发者动态更新网页...
在“WEB前端项目开发实践”这个主题中,我们主要探讨的是如何通过理论与实践相结合的方式,掌握前端开发技术并实施实际项目。对于初学者来说,这是一个极好的学习资源,能够帮助他们逐步理解并掌握前端开发的基本...
通过深入学习和实践,开发者可以充分利用jQuery和MiniUI框架,提高前端开发的效率,同时保证应用的稳定性和用户体验。无论是新建项目还是升级现有项目,这个基于jQuery和MiniUI的框架都是一个值得考虑的选择。
10. **最佳实践**:学习如何将jQuery与其他前端框架(如Bootstrap)结合,如何编写模块化的jQuery代码,以及遵循良好的命名和注释规范,都是提升代码质量和可维护性的关键。 总之,jQuery基础教程第5章会涵盖这些...
在本教程中,我们将深入探讨Web前端开发的基础...在实践中不断探索和学习,开发者可以逐步掌握更高级的技术,如框架(如React、Vue.js)、ES6+的新特性以及PWA(渐进式 web 应用)等,进一步提升自己的前端开发能力。
由于提供的文件信息中的【部分内容】实际上是关于图像变形技术的一篇学术论文摘要,并不是关于“JAVA WEB前端开发实践教程”的具体内容,所以在生成知识点时,我将基于文件标题和描述来构造知识点,而忽略这部分内容...
在网页开发中,前端分页是一...总之,jQuery前端分页显示特效是前端开发中的一个重要技能,熟练掌握这一技术能够提升用户体验,使数据展示更加高效和便捷。通过学习和实践,你可以创建出符合自己需求的个性化分页功能。
总结起来,前端框架和jQuery都是前端开发的重要组成部分。前端框架提供了构建复杂Web应用的结构,而jQuery则是简化JavaScript编程的经典工具。理解并熟练掌握这两者,对于任何前端开发者来说都是至关重要的。在实际...
**jQuery前端库详解** jQuery,一个轻量级、高性能的JavaScript库,自2006年发布以来,因其简洁易用的API而迅速成为前端开发的首选工具之一。"jQuery前端库,端面页面"这一标题揭示了我们将讨论的重点:如何使用...
交互式前端开发实践课程是针对软件技术(Java开发)和计算机网络技术(Web前端开发)专业学生的一门核心课程,旨在培养具备网页设计、网页美工以及WEB综合开发能力的初级至中级专业人才。这门课程以实践为主,理论与...
在IT行业中,前端开发是构建网站用户界面的关键部分,而jQuery作为一款强大的JavaScript库,极大地简化了DOM操作、事件处理和动画效果。本资源“75款常用的jquery特效前端网页代码”提供了丰富的示例,帮助开发者...