web前端开发规范_前端对后台的格式要求-CSDN博客

本文链接：https://blog.csdn.net/xiangxzz/article/details/52963450

本文详细介绍了前端开发的编码规范，包括通用规范、HTML规范、CSS规范和JavaScript规范。通用规范涉及制表符的使用和文件命名规则；HTML规范涵盖文档类型、元素缩进和属性定义；CSS规范包括选择器、声明块的布局和属性顺序；JavaScript规范包含注释、变量声明和比较操作等。这些规范旨在提高代码可读性，保证团队合作的顺畅。

摘要由CSDN通过智能技术生成

作为一个前端开发人员，遵守一定的编码规范是很有必要的，因此我这里总结了一些规范作为自己日后开发的编码规范，当然，在实际的工作中要优先遵守公司制定的规范，确保跟团队其他人写的代码风格上是一样的，这样有利于日后的维护。
下面总结了一些基本的编码规范，包括通用规范、html规范、css规范以及JavaScript 规范四个方面：

通用规范：

（1）用4个空格来代替制表符（tab）：由于制表符在不同系统即使使用相同的编辑器也可能会不一致（系统对制表符的解析不一致）,所以如果想代码在所有环境下展现一致就用4个空格代替制表符，现在很多编辑器都可以配置敲入Tab键时插入4个空格。
（2）文件的命名尽量用有意义的英文单词加破折号“-”：
对于文件的命名要注意：1）字母开头而不是数字开头；2）英文单词（或缩写）要全部小写，使用破折号“-”来分割；3）对于一些有前后缀或特定的扩展名的文件，使用点分隔符，下面是一些例子：

layer.js
my-style.css
my-style.min.css
jquery.cookie.min.js

html规范：

(1)使用html5的文档类型，字符编码统一使用UTF-8编码：

<!DOCTYPE HTML>
<html> 
    <head>
        <meta charset="UTF-8">
        <title>test</title>
    </head>
    <body>
    </body>
</html>

(2)嵌套元素应当缩进一次（即两个空格）
(3)属性的定义，全部使用双引号，绝不要使用单引号，如：

<input class="my-input" name="myinput" type="text">

(4)不要在自闭合元素的尾部添加斜线：
HTML中所有的自闭合标签如下：area、base、br、col、command、embed、hr、img、input、keygen、link、meta、param、source、track、wbr
推荐的例子：

<img src="....">
<br>

(5)属性的顺序：
HTML 属性推荐按照以下顺序依次排列：
class -> id, name -> data-* -> src, for, type, href -> title, alt -> aria-*, role
(6)布尔型属性可以在声明时不赋值：
XHTML规范要求为其赋值，但是HTML5规范不需要。如：

<input type="text" disabled>
<input type="checkbox" value="1" checked>
<s