基于jQuery架构javascript基础体系


Posted in Javascript onJanuary 01, 2011

jQuery的使用开始成为javascript开发者的主选产品,但如果没有一个整体的规划,简单的拿来主义势必带来后期维护成本的增加,大量的jQuery插件如同一把双刃剑,一方面大大节省了开发时间与周期,但同时也造成WEB页面加载的负担,带来的难护与二级扩展成本将非常庞大,因此,在使用之前就需要一个最基础的javascript架构体系,能明显基础功能组件,插件组件有效实施与扩展。

我们想,jQuery毕竟还只是一个基础的最底层的工具集,封装元素选择器,事件等等,基本上能满足一般的需求,但要从整体的WEB的周度来看,为了提高javascript开发的效率与可重用性,就需要有一个整体的布局,biuuu认为最简单的思路如下:

1,在现有的ajax接口之上再封装一层操作,主要是用于统一ajax入口,同时可以再细分把GET与POST两种进行分离,通过全局的入口,就能从整理上把关,如过滤参数,检验参数,增加全局参数等,一步到位,可复用性非常高,实现上如下:

var ajax= { 
get : function(){ 
jQuery.get(url, [data], [callback], [type]) 
} 
post : function(){ 
jQuery.post(url, [data], [callback], [type]) 
} 
}

2,封装统一的弹出框,对话框等交互窗口,通过统一接口实现弹窗类操作的交互,节省开发时间,同时有利于整体风格的调整与优化。

3,提供基础的插件加载函数,类似于工厂模式,统一插件加载与调用的入口,对于后期的扩展与维护提供便利,这样就不需要关心插件的更新与升级,只需要调用统一的接口。

4,其实就是一些最基础常用的函数,这个与具体的项目相关,做为全局的工具类。

从上面四点来看,整体的架构思路还只是一个比较浅层次的方案,其实还有安全,性能等方面的考虑,但至少需要有这方面的思路,越是简单就越能体现出架构的合理性,javascript体系也不例外,在实际的使用过程中,通过整合与优化,提高javascript的开发效率与提升javascript能力也就是这样简单。

Javascript 相关文章推荐
网页里控制图片大小的相关代码
Jun 13 Javascript
javaScript同意等待代码实现心得
Jan 01 Javascript
javascript Window及document对象详细整理
Jan 12 Javascript
JS不间断向上滚动效果代码
Dec 25 Javascript
jquery统计输入文字的个数并对其进行判断
Jan 07 Javascript
firefox浏览器用jquery.uploadify插件上传时报HTTP 302错误
Mar 01 Javascript
AngularJS中的过滤器filter用法完全解析
Apr 22 Javascript
使用Bootstrap Tabs选项卡Ajax加载数据实现
Dec 23 Javascript
AngularJS中的promise用法分析
May 19 Javascript
解决Vue.js父组件$on无法监听子组件$emit触发事件的问题
Sep 12 Javascript
解决element ui select下拉框不回显数据问题的解决
Feb 20 Javascript
vue子传父关于.sync与$emit的实现
Nov 05 Javascript
jQuery技巧总结
Jan 01 #Javascript
js中查找最近的共有祖先元素的实现代码
Dec 30 #Javascript
Js 弹出框口并返回值的两种常用方法
Dec 30 #Javascript
JavaScript之appendChild、insertBefore和insertAfter使用说明
Dec 30 #Javascript
Javascript事件热键兼容ie|firefox
Dec 30 #Javascript
某人初学javascript的时候写的学习笔记
Dec 30 #Javascript
Javascript延迟执行实现方法(setTimeout)
Dec 30 #Javascript
You might like
source.php查看源文件
2006/12/09 PHP
php中在PDO中使用事务(Transaction)
2011/05/14 PHP
真正根据utf8编码的规律来进行截取字符串的函数(utf8版sub_str )
2012/10/24 PHP
php如何控制用户对图片的访问 PHP禁止图片盗链
2016/03/25 PHP
PHP实现判断数组是一维、二维或几维的方法
2017/02/06 PHP
javascript 同时在IE和FireFox获取KeyCode的代码
2010/02/07 Javascript
jquery 日期分离成年月日的代码
2010/05/14 Javascript
为radio类型的INPUT添加客户端脚本(附加实现JS来禁用onClick事件思路代码)
2010/11/11 Javascript
jquery弹出层类代码分享
2013/12/27 Javascript
使用jQuery UI库开发Web界面的简单入门指引
2016/04/22 Javascript
JS JSOP跨域请求实例详解
2016/07/04 Javascript
jQuery中deferred对象使用方法详解
2016/07/14 Javascript
JavaScript中函数声明与函数表达式的区别详解
2016/08/18 Javascript
解决Window10系统下Node安装报错的问题分析
2016/12/13 Javascript
Bootstrap CSS组件之大屏幕展播
2016/12/17 Javascript
Bootstrap响应式表格详解
2017/05/23 Javascript
用React实现一个完整的TodoList的示例代码
2017/10/30 Javascript
Nodejs中获取当前函数被调用的行数及文件名详解
2018/12/12 NodeJs
vue elementUI 表单校验功能之数组多层嵌套
2019/06/04 Javascript
JS删除对象中某一属性案例详解
2020/09/08 Javascript
arcgis.js控制地图地体的显示范围超出区域自动弹回(实现思路)
2021/01/28 Javascript
python去除所有html标签的方法
2015/05/05 Python
python 字典(dict)按键和值排序
2016/06/28 Python
python实现黑客字幕雨效果
2018/06/21 Python
django rest framework 数据的查找、过滤、排序的示例
2018/06/25 Python
基于pytorch的保存和加载模型参数的方法
2019/08/17 Python
Python应用自动化部署工具Fabric原理及使用解析
2020/11/30 Python
在线购买世界上最好的酒:BoozeBud
2018/06/07 全球购物
名词解释WEB SERVICE,SOAP,UDDI,WSDL,JAXP,JAXM;JSWDL开发包的介绍。
2012/10/27 面试题
干部作风建设心得体会
2014/10/22 职场文书
公司离职证明标准格式
2014/11/18 职场文书
谢师宴邀请函
2015/02/02 职场文书
vue项目多环境配置(.env)的实现
2021/07/21 Vue.js
漫画「你在春天醒来」第10卷封面公开
2022/03/21 日漫
Mysql排查分析慢sql之explain实战案例
2022/04/19 MySQL
Spring Boot优化后启动速度快到飞起技巧示例
2022/07/23 Java/Android