Sym - 一个用 Java 实现的现代化社区平台 • 源码 • 注册

Pipe - 小而美的开源博客平台 • 体验 • 皮肤
Solo - 一个用 Java 实现的博客系统,为你或你的团队创建个博客吧! • 源码下载 
Wide - 一个基于 Web 的 Go 语言 IDE • 教程试用

JavaScript,HTML,CSS 规范小结

1. 综合

Ø 使用 UTF-8 编码。注: UTF-8 + BOM 不可

Ø 注释需有意义且描述清晰无二义

Ø 代码提交需填写提交原由

Ø JavaScriptJavaCSS 文件头部需进行版权声明

Ø 使用中文进行注释

Ø 更改代码后,需保证正常运行,否则严禁进行提交

Ø 对无用代码应进行删除;提交 SVN 时,需进行特殊标识

删除原因:

系统版本:

其它:

Ø 遵循静态资源分离注意事项

Ø 严禁随意添加第三方代码

Ø 不建议随意修改组件代码

2.  JavaScript

Ø 注释遵循 jsdoc-toolkithttp://code.google.com/p/jsdoc-toolkit/w/list

Ø 对外部只放出需要的变量和方法,其余变量、参数、方法应设为私有成员,不可通过外部对象对其进行访问及修改

Ø 对象上应避免对方法及属性的增加或修改

Ø 除静态类外,应使用 prototype  Function 添加方法

Ø 代码排版规范

² 长度不超过80个字符

² 换行时,符号需留在行末

² 关键字后如有括号,需空格

² 二元运算符(除括号、方括号、点)的两个操作数之间需进行空格

² 逗号后需空格

² 分号后需换行(for 语句中的分号需空格)

² 左大括号左边需空格,右边需进行换行;右大括号新启一行,与当前复合语句首字母对齐

Ø 使用全等进行比较 “===”,“!==

Ø 使用命名空间,如: hetong.changeTaboaweb.getList

Ø 私有函数和变量需以下划线开头进行标识

Ø 所有变量需在使用前用 var 进行声明,避免使用全局变量

Ø jQuery 对象以 进行开头进行标识,如: var $tabs = $(“#hetongTabs”)

Ø 简单语句结束时切记不要遗漏分号

Ø 声明时,请用 {} 代替 new Object()[] 代替 new Array()”” 代替 new String()

Ø 块语句即使只有一行,也需使用大括号

Ø 命名规则:functionNames、variableNames、ClassNames、EnumNames、methodNames、SYMBOLIC_CONSTANTS

Ø 版权信息后空行,对文件进行描述。格式如下:

/**
 * @fileoverview Description.
 *
 * @author <a href="mailto:LLY219@gmail.com">Liyuan Li</a>
 * @version 1.0.0.1, May 7, 2012
 */

3.  HTML

Ø 所有标签及标签属性名称使用小写

Ø 在使用标签时,需根据语义进行正确的使用

Ø 每一个块元素、列表和表元素之间需新启一行,其子元素需使用缩进

Ø 所有需闭合的标签需进行闭合

Ø 避免使用内联样式和元素内样式

Ø 禁止重复引用 js 和 css 文件

4.  CSS

Ø 注释: /* comments */

Ø 当同一属性出现两次及以上,请使用缩写

Ø 当属性值为 时,可省略其后单位

Ø 类命名使用 “–” 进行分隔。如:ico-word

Ø 尽量避免使用 hack

Ø CSS 引用请使用 link 避免使用 @import

Ø 版权信息后空行,对文件进行描述。格式如下:

/**
 * admin style.
 *
 * @author <a href="mailto:LLY219@gmail.com">Liyuan Li</a>
 * @version 1.0.3.5, May 4, 2012
 */

Ø 样式前缀

² ico- 图标

² i- 输入框

² tb- 表格

² fm- 表单

² ft- 文本

² fn- 通用样式

² bt- 按钮

² ui- 组件

Ø 样式后缀

² -focus 当前焦点

² -s 小号样式

² -m 中号样式

² -b 大号样式

² -error 错误样式

² -success 成功样式

² -warn 警告样式

Ø 样式附加项,禁止单独进行定义

² first 标签集合第一个

² last 标签集合最后一个

² selected 标签集合中选中的项

² hover 标签集合中悬停的项

² current 标签集合中的当前选项

Ø z-index

² 普通应用:1 - 999

² 悬浮菜单:1000 - 4999

² 模态窗口:5000 - 9999

Ø 书写规范如下:

² 每块规则之间需进行空行

² 每块规则的元素之间需进行一个空格

² 左大括号之前需有一个空格,其后进行换行;右大括号需重启一行并与当然块的首字母对齐

² 每条样式需新启一行,结束使用分号

² 冒号之前无空格,其后需一个空格

html {
   background: #fff;
}

body {
margin: auto;
width: 50%;
}

 

5.  Java

Ø 类前需注明类描述、作者、日期、版本。格式如下:

/**
 * Description.
 *
 * @author <a href="mailto:LLy219@gmail.com">LiYuan Li</a>
 * @version 1.0.0.1, May 10, 2012
 * @since 0.3.4
 */

Ø 仅引入需要的库且相同功能的库不可引入多个,如:json-2010-06-24.jarjackson-module-json-org-0.9.1.jarjson-lib-2.4-jdk15.jar

Ø Session 严禁随意添加

6.  后续补充

改用 HTML5,CSS3,JavaScript 采用模块化管理,有一些小工具后

Ø html 头部采用 

Ø head 标签内首行采用 

Ø 避免使用内部 JavaScript

Ø 动画、圆角、阴影尽量使用 CSS3,避免使用 JavaScript

Ø 避免使用 iframe

Ø 提交代码前可对所提交代码进行代码规范检查,通过方可提交


欢迎注册黑客派社区,开启你的博客之旅。让学习和分享成为一种习惯!

留下你的脚步