JavaScript中的字符串比较

Question

我有一个以下的字符串数组。

["div", "span", "h1", "h2", "h3", "h4", "h5", "p", "br", "a", "strong", "em", "li", "ul", "ol", "b", "i", "u", "hr", "font", "pre", "q", "s", "strike", "blockquote", "sub", "sup"]

我有一个包含HTML标签的字符串文本，我需要验证段落文本中的HTML标签是否在上面定义的字符串数组中。除此之外，如果存在任何其他标签，则必须抛出错误。我看到了许多方法，但找不到任何简单的JavaScript实现。

- rampuriyaaa

---

你需要学习JavaScript中的异常处理来产生错误。 - Avinash Babu

Answer 1

你需要解析HTML，然后测试所有标签是否与数组中匹配。我会解析HTML，遍历DOM节点，并将每个标记名称与数组进行测试：

var allowedTags = ["div", "span", "h1", "h2", "h3", "h4", "h5", "p", "br", "a", "strong", "em", "li", "ul", "ol", "b", "i", "u", "hr", "font", "pre", "q", "s", "strike", "blockquote", "sub", "sup"];
var wrapper = document.createElement("div");
wrapper.innerHTML = "<h1>Your HTML here</h1><p>Test</p><span><audio /></span>";
function walk(element) {
    var el = element;
    var len = el.childNodes.length, i;
    for(i = 0; i<len; i++) {
        if(!walk(el.childNodes[i])) return false;
    }
    return !(el.tagName && allowedTags.indexOf(el.tagName.toLowerCase()) === -1);
}
var result = !walk(wrapper);
console.log("Contains invalid tags: " + result);

jsFiddle

的翻译是：

{{链接1：jsFiddle}}

- CodingIntrigue

---

如果我使用wrapper.innerHTML="Hi I am testing this <span></span>"，那么它应该包含无效标签但显示为false...我的意思是精确的span标签。 - rampuriyaaa

如果所有标签都是有效的，则walk方法返回true。如果任何标记无效，则返回false。我否定了这个结果，以便它正确显示。因此，包含无效标记：false是正确的，因为span是有效的。 - CodingIntrigue

即使您将<span></span>作为唯一输入项，它仍会显示false，因为它不包含无效标记。尽管它是无效的... - rampuriyaaa

@ Rajat，你的理解有误。 包含无效标记：false 意味着你的HTML 不含 任何 无效 标记。Span是一个有效的标记（在数组中排名第二）。 - CodingIntrigue

+1 等待您的耐心 :) 您是如何添加 jsFiddle 按钮的？ - GôTô

Answer 2

您需要从字符串中解析出标签，然后检查标签名称是否与数组匹配；这在此问题中有讨论。解析字符串的方式取决于您的环境，但该主题在此问题中有讨论。

- Codor