正则表达式 HTML 标签 javascript答案

【问题标题】：Regular expression HTML tag javascript正则表达式 HTML 标签 javascript
【发布时间】：2016-11-26 22:29:38
【问题描述】：

我想验证输入的代码是否是HTML代码（必须以<html>开头并以</html>结尾）

我尝试这样做

var reghtml = new RegExp("(&lt;html&gt;*\n+&lt;/html&gt;)");

但是我有一个问题是需要在代码中创建一个 \n ，我需要验证第一个和结束标记（ = <html> 和 </html> ），如果他在它们之间做了一些事情是必要的< 并以 > 结尾

有什么解决办法吗？

【问题讨论】：

对不起，如果他在他们之间做点什么必须以<开头并以>结尾还不清楚。
@WiktorStribiżew 如果他像这样<html></html> 是正确的，但如果他想在标签之间做点什么，他需要以< 开头并以> 结尾，例如@987654333 @ => 错误 | <html> <test> </html> => 正确
类似/^<html>(?:\s*<[^>]*>)*<\/html>$/.test(your_html)?
您是否研究过不使用正则表达式的验证？正则表达式和 HTML 不能很好地混合
@Dbz，我想检查一个代码（用户给它）

标签： javascript html regex tags

【解决方案1】：

您不应该使用正则表达式来验证 HTML（更不用说解析它了），因为 HTML 不是“Regular Language”。

下面是一个假阴性案例的示例，它会导致您可以编写的任何正则表达式尝试验证 HTML 以将其标记为无效：

<html>
<head>
    <!-- </html> -->
</head>
<body>
    <p>This is valid HTML</p>
</body>
</html>

因为您可以在 HTML（以及 SGML 和 XML）中嵌套 cmets，所以您也无法为这种特殊情况编写简单的正则表达式：

<html>
<head>
    <!-- <!-- <!-- <!-- </html> -->
</head>
<body>
    <p>This is valid HTML</p>
</body>
</html>

这是一个误报（假设您不使用 ^$ 正则表达式锚点）：

<p>illegal element</p>
<html>
    <img>illegal text node</img>
</html>
<p>another illegal element</p>

当然，有更强大的正则表达式实现，它们为诸如计数深度之类的东西添加了基本的支持，但是你会陷入一个痛苦的世界。

验证 HTML 的正确方法是使用 HTML DOM 库。在 .NET 中，这是 HtmlAgilityPack。在基于浏览器的 JavaScript 中它更简单：只需使用浏览器的内置解析器 (innerHTML)：

（盗自Check if HTML snippet is valid with Javascript）

function isValidHtml(html) {
    var doc = document.implementation.createHTMLDocuiment("");
    doc.documentElement.innerHTML = html;
    return ( doc.documentElement.innerHTML === html );
}

【讨论】：

【解决方案2】：

这里给你一个模式。它检查第一级是否有有效的开始和结束标签。第一级必须有结束标签，你不能这样做<html><img /></html>，因为你可以删除整个结束标签检查模式部分。

var validHtml = '\
<html itemscope>\
	<head></head>\
	<body style="background: red;">\
		Everything is fine\
	</body>\
</html>\
',
	invalidHtml = '\
<html itemscope>\
	<head></foot>\
	<body>\
		Nothing is fine\
	</body>\
</html>\
',
	pattern = /^\s*<html(?:\s[^>]*)?>(?:\s*<(\w+)(?:\s[^>]+)?>(?:.|\s)*<\/\1>\s*)*<\/html>\s*$/i;
	
console.log(pattern.test(validHtml) ? 'valid' : 'invalid');
console.log(pattern.test(invalidHtml) ? 'valid' : 'invalid');

【讨论】：