【前端3分钟】高效使用jQuery
2018-03-02 20:15
190 查看
DOM 操作
createDocumentFragment 代替 createElement 创建节点内容在createDocumentFragment中可以将多个文档内容片段先缓存起来,最后一次性插入到DOM中;而createElement每次创建节点都需要插入到DOM 中,所以前者能提高DOM操作效率。
JQuery 高效使用
尽可能使用ID选择器进行DOM查询操作,不同使用组合选择器缓存一切需要复用的jqeury Dom 对象,使用find()子查询
不用滥用jQuery,尽量使用原生代替
尽可能使用jQuery静态方法
使用事件代理,不要直接使用元素的事件绑定
尽量使用较新的的版本
尽可能使用链式写法来提高编程效率和代码运行效率
前端MVC模式
基本思路: 将DOM交互的内容分为“数据模型”、“视图”、“事件控制函数”三个部分,并对它们进行统一管理。Model用来存放请求的数据结果和数据对象;
View 用于页面DOM的更新与修改;
Controller用于根据前端路由条件来调用不同Model给View渲染不同数据内容
路由的主要思路:让URL地址内容匹配对应的字符串然后进行相应的操作;另外HTML5中history.pushState(state,title,url)方法可以改变当前页面的url而不发生跳转,并将不同的state数据和对应的url对应起来。如果页面显示的内容是根据不同的数据状态来自动完成的,这样根据state的内容来加载不同的组件就很有用。
相关文章推荐
- 使用JQuery的前端验证
- 使用JQuery 将DataTable 转化成JSON数据,前端无法处理JSON数据的注意事项
- 【前端】在网页使用jquery-qrcode生成二维码
- 关于引入多个jquery冲突的问题(附一个很好用的validate前端验证框架及使用方法)
- 使用jquery-validationEngine框架,4步实现前端JS校验
- 关于使用jQuery前端上传文件
- 高效使用jQuery之选择器
- 使用jquery.i18n.properties 实现web前端国际化
- jQuery前端框架easyui使用Dialog时bug处理
- 前端----表格的具体使用(jquery)
- 使用jquery-validationEngine框架,4步实现前端JS校验
- 使用Jquery快速高效制作网页交互特效
- 怎样才能高效地使用JQuery
- 源码-JavaScript&jQuery交互式前端开发-第2章-JavaScript基础指令-使用变量来存储数字
- 五滴水:使用Ajax+jQuery来实现前端收到的数据在console上显示+简单的主页设计与bootstrap插件实现图片轮播
- 使用 jQuery.i18n.properties 实现 Web 前端的国际化
- web前端入门:使用jQuery操作元素的属性与样式
- 使用jquery-validationEngine框架,4步实现前端JS校验
- 关于前端惰性加载(jquery_lazyload)的使用和原理分析
- 【springmvc】之使用jQuery接收前端传入List对象