文档介绍：WEB前端开发规范文档目录WEB前端开发规范文档 1规范目的 2基本准则 2文件规范 2html书写规范 2html其他规范 3css书写规范 4JavaScript书写规范 5jQuery部分 5开发及测试工具约定 6其他规范 6规范目的为提高团队协作效率,便于后台人员添加功能及前端后期优化维护,输出高质量的文档,特制订此文档:本规范文档一经确认,前端开发人员必须按本文档规范进行前台页面开发:本文档如有不对或者不合适的地方请及时提出,经讨论决定后方可更改:基本准则1: 符合web标准,语义化html,遵循内容(HTML)、显示(CSS)、行为(JavaScript)分离的 代码组织模式。2:代码格式化,保持干净整洁。3:换行必须缩进一个tab。4:编写所有前台页面时,请使用已有模板进行复制,在模板的基础上进行开发。5:每一个页面都必须有一个独立的css,js文件。6:如果不是用HTML5编写的网站,请用IE7,IE8,IE9,火狐, 谷歌,webkit,safari内核进行测试兼容性。7:如果是HTML5编写的网站,请用IE9,火狐,谷歌,webkit, safari内核进行测试兼容性。文件规范 1:html,css,js,images文件均归档至<系统开发规范>约定的目录中; 2:html文件命名:英文命名,后缀:htm:同时将对应界面稿放于同目录中,若界面稿命名为中文,请重命名与html文件同名,以方便后端添加功能时查找对应页面; 3:css文件命名:英文命名,后缀:css:共用base:css,首页index:css,其他页面依实际模块需求命名:; 4:Js文件命名:英文命名,后缀:js:mon:js,其他依实际模块需求命名:html书写规范1:所有元素都必须小写,属性也是,如: <inputtype=”text”id=”idName”/>正确<INPUTTYPE=”text”ID=”idName”/>错误2:元素必须成对出现,如<span>必须写成<span></span>特殊元 素除外,如:<br/><hr/><img/><input/>3:标签中不允许出现样式,必须用class来声明样式,如:<inputtype=”text”id=”idName”style=”text-align:right;”/>错误<inputtype=”text”id=”idName”class=”class-name”/>正确4:元素id命名必须是驼峰式命名如:<inputtype=”text”id=”idName”/>正确<inputtype=”text”id=”idname”/>错误<inputtype=”text”id=”id-name”/>错误5:元素class命名规范是:元素简写+”-”+功能名,如:<buttoncalss=”btn-save”></button>正确<buttoncalss=”btnSave”></button>错误<buttoncalss=”save”></button>错误6:元素name命名必须遵循驼峰式命名法。<inputtype=”text”name=”idName”/>正确<inputtype=”text”name=”idname”/>错误<inputtype=”text”name=”id-name”/>错误7:元素属