有没有像JSLINT一样基于JavaScript的html/css检查器?
以下是后者的一个示例错误信息:
C:\dev\html>cscript //E:JScript c:\users\dino\bin\csslint-wsh.js --format=compiler style\basic.css
CSSLINT
style\basic.css(5,1) CSSLINT: warning: Heading (h1) has already been defined.
h1 { font-size: 20pt }
style\basic.css(6,1) CSSLINT: warning: Heading (h2) has already been defined.
h2 { font-size: 18pt; font-weight:bold; color: navy }
style\basic.css(7,1) CSSLINT: warning: Heading (h3) has already been defined.
h3 { font-size: 16pt; font-weight:bold; color: #483d8b;}
style\basic.css(8,1) CSSLINT: warning: Heading (h4) has already been defined.
h4 { font-size: 14pt; font-weight:bold; color:#C71585; margin-bottom:2px; }
style\basic.css(9,1) CSSLINT: warning: Heading (h5) has already been defined.
h5 { font-size: 12pt; font-weight:bold; color:#6495ED; margin-bottom:2px; }
style\basic.css(10,1) CSSLINT: warning: Heading (h6) has already been defined.
h6 { font-size: 10pt; font-weight:bold; color:navy }
style\basic.css(12,1) CSSLINT: warning: Element (td.head) is overqualified, just use .head without element name.
td.head { font-size: 12pt; color: #c71585; font-weight: bold; }
style\basic.css(39,4) CSSLINT: warning: Broken box model: using width with padding.
width: 48%;
style\basic.css(44,4) CSSLINT: warning: Broken box model: using width with border.
margin: 0.2em 0 0.2em 0;
在使用带有flymake的Emacs时的示例:
最近我使用JavaScript编写了HTML lint,可与HTML minifier(源代码位于Github上)一起使用。它基于Resig / Arvidsson HTML解析器的调整版本。
HTML Inspector是一个JavaScript HTML验证器,可以在浏览器或Node中运行:https://github.com/philipwalton/html-inspector
这是CodePen使用的相同验证器。
最近我开始使用grunt-html,经过几个小时的调试后才发现我漏掉了一个闭合括号>
,导致我的html-minifier挂起。
我不确定它是否完美,也不指望它能百分之百符合W3C标准。但它确实有助于捕捉语法/简单错误。
我还发现了一个W3C变体grunt-html-validation。