一直使用JQUERY(或者说是JAVASCRIPT)来进行开发,有着的如下的几个问题:
1. JS文件太多,基本上是一个功能就需要使用一个JS文件
2. 对于同一个功能,大量的重复性代码,比如某一个区域需要使用到TAB,只是元素不一样而已。
3. 大量的纯DOM编程
4. 不注重JS的代码效率
一个好的JS前端架构:
对于一个好的JS前端架构而言(当然它是基于jQuery),至少应该包含有如下几个方面
1. 属于公司本身的JS命令空间(大多以公司英文名)
2. 基本的操作工具集,即最常用的工具方法(对原有的JAVASCRIPT以及JQUERY来进行封装),对于静态的工具类,一般命名为util,一般包括如下的工具方法
命名空间下的常量
命名空间名
命名空间说明
命名空间的版本号
操作方法的封装
针对原有对象的封装(String,Date):
String对象
repeat(重复) trim(对两边进行清空) spilt 针对特殊字符的转义
对某一个字符串的查找 查找不区分大小写
字符串的截取以及自动填充
字符串的截取(自动识别单词或者是文字,而非以字符截取)
Date 对象
格式化
Location 对象
获得当前的地址
获得当前的主机头
获得URL
URL的重定向
对对象进行扩展封装
变量
判断变量是否存在
数据类型的判断
获得某一个变量的类型,特别是Object对象的细分(在JAVASCRIPT中,Date,Object,Function其实都是Object对象)
针对AJAX
让服务器端返回的数据,以正常的格式返回(即使用eval函数)
针对URL参数封装(特别是编码问题)
AJAX跨域的封装
服务器端返回的JSON字符串转换成JSON数组(当在服务器端,使用非encode_json时)
针对对象参数
对参数进行初始化
针对数组
是否为数组对象 is_array()
数据元素中的删除
DOM对象
当前元素是否存在子元素
当前对象是否为DOM对象
浏览器事件封装
某一个DOM对象的选中
某一个DOM对象的复制
某一个DOM对象文本复制之后的粘贴
调试方法
提供可配置模式:是否为开发模式 还是 生产模式 (开发模式下,允许使用特定的log方法,将错误输出到特定的DIV中)
客户端报错写入到日志中
console控制台调试
变量输出
报错机制
在特定的类别中添加错误
for example : addErrorMessage(‘email’, ‘Please enter your email address.’);
删除错误
removeErrorMessage(‘email);
输出错误(可自定义格式)
常用的一些快捷方法
设置首页
添加到收藏
全屏
打印
常用快捷键(或者是按键)的封装
获得当前按键的KeyCode
ESC键
Enter键
F1-F12键等
Cookie操作
在客户端存储cookie
在客户端读取cookie
自定义的JAVASCRIPT操作
常用的JS工具集:
Date处理
字符串的过滤以及分割-->特别是针对汉字
 
必须要考虑
处理国际化的问题
AJAX的安全性—>仅提供一个ajax,让所有的AJAX全部经过此AJAX,以达到隐藏AJAX连接的能力
分享
点击连接登陆
常用的效果
表单验证
单选框是否选中
复选框是否选辑
下拉框是否有选中
tooltip
TAB
Accordion
Lightbox
拖放
                    
                
                
            
        
浙公网安备 33010602011771号