1

我想在 javascript 中对某些输入进行验证，如果它是有效的 Html 标记，则返回有效。

有没有使用 JQuery 的简单方法来做到这一点？如果没有，那么有什么方法可以使用正则表达式吗？

谢谢：）

4

2 回答 2

2

您可以只制作一组有效标签，然后使用 jQuery。inArray（标签，有效标签）；

var validTags = ["<html>","<body>","<div>"];
var valid = function(tag){
    return $.inArray(tag,validTags);
}
var x = valid("<body>"); //evaluates to true

如果您想接受任何只有字母的标签名称，这里有一个正则表达式可以帮助您入门。它没有经过彻底测试，但旨在接受一个或多个不区分大小写的字母。如果您还想允许数字，请在括号之间添加一个 \d ，例如[A-Za-Z\d]。

var validTag = /^<\/?[A-Za-z]+>$/;
var valid = function(tag){
  return validTag.test(tag);
}

有关更多正则表达式帮助，请参阅此页面。

于 2013-02-05T02:25:54.363 回答
0

很久以前我为此写了一个方法。我已经把它变成了一个Element财产。使用下面的代码来测试元素标签的有效性，如下所示：

ele.isValidTag();

因此，例如，如果您想查看是否blink有效，如果无效，则插入 CSS 以使<blink>标签实际闪烁，您可以这样做：

if (!document.createElement('blink').isValidTag()) {
    var head = document.head || document.getElementsByTagName("head")[0],
        style = document.createElement("style");
    /* Standard (Mozilla) */
    style.appendChild(document.createTextNode("@keyframes blink { from { opacity: 1; } to { opacity: 0; } }"));
    /* Chrome & Safari */
    style.appendChild(document.createTextNode("@-webkit-keyframes blink { from { opacity: 1; } to { opacity: 0; } }"));
    style.appendChild(document.createTextNode("blink { -webkit-animation: blink 600ms infinite; animation: blink 600ms infinite; text-decoration: blink; }"));
    head.appendChild(style);
}

注意：
接受true, 的参数以包含过时的标签。或用于-1自动绕过过时的检查。

/*  Copy && Paste   */
Object.defineProperty&&!Element.prototype.hasOwnProperty("isValidTag")?Object.defineProperty(Element.prototype,"isValidTag",{value:function(b){if(this.tagName){var c="acronym applet basefont bgsound big blink center dir font frame frameset hgroup isindex listing marquee multicol nextid nobr noembed noframes plaintext spacer strike tt xmp".split(" "),a=this.tagName;return a.match(/[^a-zA-Z0-9]/)?!1:-1!==b&&-1!==c.indexOf(a.toLowerCase())?b||!1:"[object HTMLUnknownElement]"!==Object.prototype.toString.call(document.createElement(a))}return!1}}):Element.prototype.isValidTag=function(b){if(this.tagName){var c="acronym applet basefont bgsound big blink center dir font frame frameset hgroup isindex listing marquee multicol nextid nobr noembed noframes plaintext spacer strike tt xmp".split(" "),a=this.tagName;return a.match(/[^a-zA-Z0-9]/)?!1:-1!==b&&-1!==c.indexOf(a.toLowerCase())?b||!1:"[object HTMLUnknownElement]"!==Object.prototype.toString.call(document.createElement(a))}return!1};
/*  Copy && Paste   */

例子：

Object.defineProperty && !Element.prototype.hasOwnProperty("isValidTag") ? Object.defineProperty(Element.prototype, "isValidTag", {
        value: function(b) {
            if (this.tagName) {
                var c = "acronym applet basefont bgsound big blink center dir font frame frameset hgroup isindex listing marquee multicol nextid nobr noembed noframes plaintext spacer strike tt xmp".split(" "),
                    a = this.tagName;
                return a.match(/[^a-zA-Z0-9]/) ? !1 : -1 !== b && -1 !== c.indexOf(a.toLowerCase()) ? b || !1 : "[object HTMLUnknownElement]" !== Object.prototype.toString.call(document.createElement(a))
            }
            return !1
        }
    }) :
    Element.prototype.isValidTag = function(b) {
        if (this.tagName) {
            var c = "acronym applet basefont bgsound big blink center dir font frame frameset hgroup isindex listing marquee multicol nextid nobr noembed noframes plaintext spacer strike tt xmp".split(" "),
                a = this.tagName;
            return a.match(/[^a-zA-Z0-9]/) ? !1 : -1 !== b && -1 !== c.indexOf(a.toLowerCase()) ? b || !1 : "[object HTMLUnknownElement]" !== Object.prototype.toString.call(document.createElement(a))
        }
        return !1
    };

if (!document.createElement('blink').isValidTag()) {
	var head = document.head || document.getElementsByTagName("head")[0],
		style = document.createElement("style");
	/* Standard (Mozilla) */
	style.appendChild(document.createTextNode("@keyframes blink { from { opacity: 1; } to { opacity: 0; } }"));
	/* Chrome & Safari */
	style.appendChild(document.createTextNode("@-webkit-keyframes blink { from { opacity: 1; } to { opacity: 0; } }"));
	style.appendChild(document.createTextNode("blink { -webkit-animation: blink 800ms infinite; animation: blink 800ms infinite; text-decoration: blink; }"));
	head.appendChild(style);
}
<p>
  Hi <blink>I</blink> should be <blink>Blinking</blink>!
</p>

于 2016-02-25T21:10:06.940 回答