HTML 语法错误使用 javascript 突出显示

Question

我正在为我们的内容团队使用的第三方网站构建chrome扩展程序。

我需要语法突出显示来显示语法错误- 例如像< /span>这样的损坏的html标签，像href="http : //domain / page /"这样的损坏属性，没有正确关闭的标签。 JavaScript可能吗？

截至目前，我正在使用highlight.js，在完成工作后几乎没有正则表达式替换。 有什么更好的解决方案吗？ 如何找到缺少的封闭标签？

$('.edit-definition').each(function (i, block) {
hljs.highlightBlock(block);
block.innerHTML = block.innerHTML
.replace(/(&lt;/s)/g, "<span class='hljs-red'>$1</span>") //spaces in the start of tag
.replace(/(s+>|s+&gt;)/g, "<span class='hljs-red'>$1</span>") //spaces in the end of tag
.replace(/(https|httpss|s+//s+|s+\\s+|s+/s+|s+\s+)/g, "<span class='hljs-red'>$1</span>") //spaces in urls
});

Answer 1

有几个 linter 可用，例如 html-lint。 他们会给你你的html的所有错误。

请注意，href属性中允许使用前导空格和尾随空格。linters 很可能不会在 URI 中找到空格，这些您必须自己找到 I 使用正则表达式。