前端其他规范

1. 前端开发核心思想

• 内容、表现和行为分离；
• 标记应该结构良好、语义正确以及普遍合法；
• Javascript应该起到渐进式增强用户体验的作用；

2. 定律

永远遵循同一套代码规范

3. 基本准则

1. 结构，样式，行为分离。
2. 缩进：统一使用两个空格缩进，不能用tab和空格混搭的样式。
3. 文件编码：使用不带BOM(Byte order mark)的UTF-8编码。
   • 在文件中指定编码方式：
4. 一律使用小写字母，不能大小写混合。
   1. html示范
      • 正确示范：
      • 错误示范：
   2. css示范
      • 正确示范：color: #e5e5e5;
      • 错误示范：color: #E5E5E5;
5. 省略外链资源URL协议部分。
   1. 省略外链资源（图片和其他媒体资源）URL中的http/https协议，使URL成为相对地址
   2. 避免mixed content问题，减少文件字节数
   3. 其他协议（ftp等）的URL不省略协议部分
      • html正确示范：
      • html错误示范：
      • css正确示范：

        .dog{
            background: url(//www.google.com/images/dog.png);
        }
        

      • css错误示范：

        .dog{
            background: url(http://www.google.com/images/dog.png);
        }
        

6. 文件命名规范

• 文件命名统一采用小写字母
• 不要包含空格和特殊符号

4. 文件规范

1. html,css,js,images归类到约定的目录中
2. html文件命名：英文命名，后缀为.html；将统一页面文件放在同一个目录中，以便后端添加功能时快速的找到对应的页面。
3. css文件命名：英文命名，后缀为.css；共用文件为base.css；首页是index.css；其他页面依据需求命名。
4. js文件命名：英文命名，后缀为.js，共用common.js；其他模块按照需求名命名。

5. 通用规范

1. 所有页面按照统一的格式来写；
2. 对所有后台请求的返回结果做判断空处理（保证在后台请求失败的情况下，浏览器控制台不会报错）；
3. 所有功能模块写注释；
4. 处理逻辑一定要尽量简化，抽取公共框架，减少后期维护成本；
5. tab键用两个空格代替或用两个空格缩进（务必）；
6. 代码行之间尽量不要有空行，重大逻辑转折、语法意义转折，方法分割除外，适当空行增强可读性；
7. 可使用 W3C HTML/CSS Validator 来验证你的 HTML/CSS 代码有效性;

6. 文件、资源和目录命名约定

（适用于所有前端维护的内容和相关目录，(html, css, js, png, gif, jpg, ico)等）

1. 字母一律小写，必须是英文单词或者汉语拼音，以英语单词优先，多个单词以连字符 - 连接。 只能出现小写引文字母，数字和连字符；
2. 浏览器广告拦截插件会将含有这些词的作为广告拦截： ad、ads、adv、banner、sponsor、gg、guangg、guanggao等，页面中尽量避免采用以上词汇来命名；
3. 文件命名总是以字母开头而不是数字，以特殊字符开头命名的文件，一般都有特殊的含义与用处，慎用。
4. 需要对文件增加前后缀或特定的扩展名（比如 .min.js, .min.css），抑或一串前缀（比如 asdasd.main.min.css）。这种情况下，建议使用点分隔符来区分这些在文件名中带有清晰意义的元数据。

参考：全部内容来自网络。