前端编码规范

HTML

语法

  • 四个空格代替制表符(tab)。

  • 注释、注释、注释。

  • 嵌套元素须缩进一次,杜绝内容错乱。

  • 属性定义一律使用双引号

  • 标签结束加上斜杠,包括单标签。

  • 保证标签语义化

  • 属性应按照一定顺序依次排列,确保代码易读性。


属性排序

  • class

  • id,name

  • data-*

  • src,for,type,href

  • title,alt

  • aria-*,role


CSS

语法

  • 四个空格代替制表符(tab)。

  • 命名:类名使用小写字母中划线分隔,id采用驼峰式命名。

  • 每写完一个选择器的属性后,添加一个回车保证代码易读。

  • 为了代码的易读性,在每个声明块的左花括号前添加一个空格。

  • 每条属性声明的冒号后面需添加一个空格。

  • 每条属性声明应该独占一行。

  • 每条属性声明结尾都应加上分号表示结束。

  • 十六进制值应该全部小写。

  • 属性应按照一定顺序依次排列,确保代码易读性。


属性排序

  • positioning(定位),如 postion,margin

  • box model(盒模型),如width,float

  • typographic(印刷),如font,color

  • visual(视觉),如background,border


JavaScript

语法

  • 四个空格代替制表符(tab)。

  • 注释、注释、注释。

  • 字符串最外层统一使用单引号

  • 命名:变量函数采用驼峰式命名,常量全大写,用下划线连接。

  • 构造函数,首字母大写。

  • jquery对象以$开头命名。

  • 一个函数作用于内所有变量声明放在函数首部,只用一个var声明,逗号隔开。

  • 多用===!==,少用==!=

  • 上下文this引用统一使用self变量来命名。


参考

编码规范 by @mdo

编码规范 by @AlloyTeam


转载于:https://my.oschina.net/cobish/blog/526990

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值