美文网首页
前端书写规范

前端书写规范

作者: 予以暖杀风 | 来源:发表于2017-05-24 16:12 被阅读0次

==注重结构、表现、行为分离==

1. html结构

1. 统一为html5声明类型<!DOCTYPE html>; 编码统一为<meta charset="utf-8" /> 
2.不允许写行内样式与内联样式表;
3.css引入统一放入</head>前;
4.javascript引入建议统一放入</body>前;
5.页面公用样式统一放入reset.css中,分别引入;独用样式,按需引入。
6.代码缩进,使用Tab键实现层次分明的缩进;
7.标签必须小写,合理关闭。
8.所有的标签必须合理嵌套,注重语义化。
9.自定义属性推荐使用 data-;布尔类型的属性,建议不添加属性值。
9.属性名必须使用小写字母,用双引号包围。
10.表单:必须为含有描述性表单元素(input, textarea)添加label。使用 button 元素时必须指明 type 属性值。尽量不要使用按钮类元素的 name 属性。
11.图片:禁止 img 的 src 取值为空。避免为 img 添加不必要的 title 属性。为重要图片添加 alt 属性。 添加 width 和 height 属性,以避免页面抖动。

2. css表现

1.(禁止)将样式写为单行
2. 省略“0”值后面的单位。不要在0值后面使用单位,除非有值。
3. 不要在CSS中使用expression
4.(禁止)使用css原生@import
5. 不要在CSS中使用!important
6.(不推荐)ie使用filter,( 禁止)使用expression
7. 使用after或overflow的方式清浮动
8. 去掉小数点 0
9.每个样式属性后加 ";"
10.避免浏览器hacks
11Class命名中(禁止)出现大写字母,(必须)采用“- ”对class中的字母分隔
12.ID和class(类)命名应反应元素目的和用途的名称,或其他通用名称。代替表象和晦涩难懂的名称。
13.尽可能使用缩写属性,如padding,margin,background,font。
14.URI值(url())不要使用引号。
15.删除空属性及注释后的无效属性。
16.书写顺序:显示属性,元素位置,元素属性,元素内容属性

3. JavaScript

1.(禁止)使用eval,有注入风险,尤其是ajax返回数据,效率低,
2. 除了三目运算,if,else等(禁止)简写
3. 当需要缓存this时必须使用变量进行缓存
4. 左花括号置于行末,右花括号置于行首。
5. 声明变量,必须var。
4、类命名: 首字母大写, 驼峰式命名. 如 ITaoLun;
5、函数命名: 首字母小写驼峰式命名. 如iTaoLun();
6、命名语义化, 尽可能利用英文单词或其缩写;
7、尽量避免使用存在兼容性及消耗资源的方法或属性, 比如eval_r() & innerText;
8、后期优化中, JavaScript非注释类中文字符须转换成unicode编码使用, 以避免编码错误时乱码显示;
9、代码结构明了, 加适量注释. 提高函数重用率;
10、注重与html分离, 减小reflow, 注重性能.

相关文章

  • 前端书写规范

    ==注重结构、表现、行为分离== 1. html结构 2. css表现 3. JavaScript

  • 前端规范

    前端规范 规范说明 此为前端开发团队遵循和约定的代码书写规范,意在提高代码的规范性和可维护性。此规范为参考规范,统...

  • css命名整理

    文章整理了Web前端开发中的各种CSS规范,包括文件规范、注释规范、命名规范、书写规范、测试规范等。 一、文件规范...

  • css命名规范整理

    文章整理了Web前端开发中的各种CSS规范,包括文件规范、注释规范、命名规范、书写规范、测试规范等。 一、文件规范...

  • 前端书写规范建议

    1.项目、目录及文件命名 1.1 全部采用小写方式, 以下划线分隔。 项目命名: 用项目对应的英文单词命名。例:m...

  • WEB前端规范

    1. 规范说明 此为前端开发团队遵循和约定的代码书写规范,意在提高代码的规范性和可维护性。此规范为参考规范,不全是...

  • CSS综合

    1、 前端编码规范 HTML书写规范 所有编码均遵循xhtml标准, 标签 & 属性 & 属性命名 必须由小写字母...

  • 前端自我修养-规范书写

    前言 本篇文章属于长篇大论,没有耐性的同学只看标题就行了。写这篇文章的时候名字我也纠结了好久,诸如”论文件的命名”...

  • 移动前端开发规范(一般规范)

    系列目录 移动前端开发规范(一般规范)移动前端开发规范(技术栈规范)移动前端开发规范(HTML规范)移动前端开发规...

  • 云积分前端规范

    1.规范说明 此为前端开发团队遵循和约定的代码书写规范,意在提高代码的规范性、扩展性、可维护性、阅读性,提高工作效...

网友评论

      本文标题:前端书写规范

      本文链接:https://www.haomeiwen.com/subject/ngroxxtx.html