资讯专栏INFORMATION COLUMN

htmlhint 规则详解

Ethan815 / 671人阅读

摘要:静态检查规则工具内置条规则,可以对代码文件进行静态代码检查,从而提高代码编写的规范和质量。现在把条规则翻译如下。规则级别符合规范的不符合规范的配置值启用规则禁用规则标签必须出现标签必须出现在标签中。

HTML 静态检查规则

HTMLHint 工具内置 23 条规则,可以对 HTML 代码文件进行静态代码检查,从而提高 HTML 代码编写的规范和质量。现在把 23 条规则翻译如下。

一、规则列表

标签名必须小写

属性名必须小写

属性值必须放在双引号中

属性值一定不可为空

属性值一定不可重复

Doctype必须是 HTML 文档的第一行

标签必须成对

标签必须自封闭

特殊字符必须

ID 属性必须唯一

src 属性一定不可为空

title 属性必须出现在标签中

img 标签必须包含 alt 属性

Doctype 必须是 HTML5

ID 和 Class 的命名规则必须统一

不该使用样式标签

不该使用行内样式

不该使用行内脚本

空格和制表符一定不可混合在行前

ID 和 Class 一定不可使用广告关键词

href 必须是绝对路径或者相对路径

属性值一定不可使用不安全字符

script 标签不该使用在头部

二、规则解读

1. 标签名必须小写

规则 ID: tagname-lowercase

级别: error

符合规范的:

不符合规范的:


配置值:

true: 启用规则

false: 禁用规则

2. 属性名必须小写

规则 ID: attr-lowercase

级别: error

符合规范的:


不符合规范的:


配置值:

true: 启用规则

false: 禁用规则

6. Doctype 必须是 HTML 文档的第一行

规则 ID: doctype-first

级别: error

符合规范的:


不符合规范的:

配置值:

true: 启用规则

false: 禁用规则

7. 标签必须成对

规则 ID: tag-pair

级别: error

符合规范的:

不符合规范的:

    配置值:

    true: 启用规则

    false: 禁用规则

    8. 标签必须自封闭

    空标签必须自封闭

    规则 ID: tag-self-close

    级别: warning

    符合规范的:


    不符合规范的:


    配置值:

    true: 启用规则

    false: 禁用规则

    9. 特殊字符必须转义

    规则 ID: spec-char-escape

    级别: error

    符合规范的:

    aaa>bbb

    不符合规范的:

    aaa>bbb

    配置值:

    true: 启用规则

    false: 禁用规则

    10. ID 属性必须唯一

    同一个 HTML 文档中 ID 属性必须唯一。

    规则 ID: id-unique

    级别: error

    符合规范的:

    不符合规范的:

    配置值:

    true: 启用规则

    false: 禁用规则

    11. src 属性一定不可为空

    img、script 或 link 标签的 src 属性一定不可为空,因为空的 src 属性会导致当前页面被访问两次。

    规则 ID: src-not-empty

    级别: error

    符合规范的: