验证字符串是否是有效的 HTML 标记名称答案

【问题标题】：Verify whether a string is a valid HTML tag name验证字符串是否是有效的 HTML 标记名称
【发布时间】：2014-10-09 19:40:24
【问题描述】：

如何确定字符串是否为有效的 HTML 标记？

例如：a、或 h1、div 或 span、... 是有效的 HTML 标记名。但是 ar, 或者 abc, 或者 div2, ... 是无效的。

var Str = 'strongg';

if( IsValid(Str) ) {
// do something
}

谢谢。

PS 我认为，这不是一个愚蠢的问题，我在这里找到了一个很好的解决方案（见下文）。但我不知道为什么这个线程有“-3”？想知道！

【问题讨论】：

创建一个有效标签名数组，对照该数组检查字符串
您可以获得有效标签名称列表here。为什么不将它们存储在IsValid 的数组中，然后将Str 与每个元素进行比较？
我知道这个解决方案。但是有更好的方法吗？

标签： jquery dom

【解决方案1】：

HTML5 引入了HTMLUnknownElement interface，它必须用于标准 HTML 规范未定义的元素。

使用document.createElement 时，如果元素不是规范的有效标签，它将是HTMLUnknownElement 类型的对象。由于使用.toString 将返回[object type]，因此您可以创建元素并测试该类型：

function isValid(input) {
  return document.createElement(input).toString() != "[object HTMLUnknownElement]";
}

console.log( isValid("tr") );
console.log( isValid("a") );
console.log( isValid("trs") );
console.log( isValid("strong") );
console.log( isValid("strongg") );

但是，这在旧版浏览器中无法使用。

【讨论】：

感谢您的回答。我已经在我的项目中使用了createElement，因此它是我的功能的直觉解决方案。

【解决方案2】：

获取有效的 HTML 标签列表（或任何你想比较的标签），然后简单地执行以下操作：

function IsValid(s) {
    var tags = ['a', 'p', 'etc...'];
    return tags.indexOf(s) != -1;
}

【讨论】：

感谢您的回答。

【解决方案3】：

您必须获取并使用自己的 HTML 标记数组来检查这一点 - 我个人会使用 W3C spec 而不是 w3schools。

然后，您想在数组上使用 indexOf 并检查它是否不是 -1，如下所示：

var isValid = function (tagCandidate) { return (validHtmlTags.indexOf(tagCandidate) > -1); };

【讨论】：