检查一个string是否是html
我有一个特定的string,我想检查它是否是一个HTML。 我正在使用正则expression式,但没有得到正确的结果。
我validation了我的正则expression式,它在这里工作正常。
var htmlRegex = new RegExp("<([A-Za-z][A-Za-z0-9]*)\b[^>]*>(.*?)</\1>"); return htmlRegex.test(testString);
这里是小提琴,但正则expression式没有在那里运行。 http://jsfiddle.net/wFWtc/
在我的机器上,代码运行良好,但我得到了一个错误,而不是真正的结果。 这里错过了什么?
用来检查string是否为HTML的更好的正则expression式是:
/^/
例如:
/^/.test('') // true /^/.test('foo bar baz') //true /^/.test('<p>fizz buzz</p>') //true
事实上,它是如此的好,它会传递给它的每个string返回true
,这是因为每个string都是HTML 。 严重的是,即使格式不正确或无效,它仍然是HTML。
如果你正在寻找的是HTML元素的存在,而不是简单的任何文本内容,你可以使用以下几行:
/<[az][\s\S]*>/i.test()
它不会帮助你以任何方式parsingHTML,但肯定会将该string标记为包含HTML元素。
我知道这是有点晚回答,但是我只是想到这个问题,并写了这个简单的函数来testing,如果该string包含HTML数据。
function isHTML(str) { var a = document.createElement('div'); a.innerHTML = str; for (var c = a.childNodes, i = c.length; i--; ) { if (c[i].nodeType == 1) return true; } return false; }
这个想法是允许浏览器的DOMparsing器来决定提供的string是否看起来像一个HTML或不。 正如你所看到的,我只是简单地检查ELEMENT_NODE
( nodeType
为1)。
我做了一些testing,看起来像是有效的:
isHTML('<a>this is a string</a>') // true isHTML('this is a string') // false isHTML('this is a <b>string</b>') // true
只是认为分享这将有助于未来的人。 无论如何,有一个select是件好事。
UPD。 另一种使用DOMParser的变体,没有加载img / video /等的副作用。 parsing期间的资源:
function isHTML(str) { var doc = new DOMParser().parseFromString(str, "text/html"); return Array.from(doc.body.childNodes).some(node => node.nodeType === 1); }
笔记:
1. Array.from
是ES2015方法,可以用[].slice.call(doc.body.childNodes)
replace。
2. some
通话中的箭头function可以用通常的匿名function代替。
一点validation:
/<(?=.*? .*?\/ ?>|br|hr|input|!--|wbr)[az]+.*?>|<([az]+).*?<\/\1>/i.test(htmlStringHere)
这将search空标签(一些预定义的)和/
终止的XHTML空标签,并validation为HTML,因为空标签或将捕获标签名称,并尝试find它的string中的结束标签validation为HTML。
解释演示: http : //regex101.com/r/cX0eP2
更新:
完整的validation:
/<(br|basefont|hr|input|source|frame|param|area|meta|!--|col|link|option|base|img|wbr|!DOCTYPE).*?>|<(a|abbr|acronym|address|applet|article|aside|audio|b|bdi|bdo|big|blockquote|body|button|canvas|caption|center|cite|code|colgroup|command|datalist|dd|del|details|dfn|dialog|dir|div|dl|dt|em|embed|fieldset|figcaption|figure|font|footer|form|frameset|head|header|hgroup|h1|h2|h3|h4|h5|h6|html|i|iframe|ins|kbd|keygen|label|legend|li|map|mark|menu|meter|nav|noframes|noscript|object|ol|optgroup|output|p|pre|progress|q|rp|rt|ruby|s|samp|script|section|select|small|span|strike|strong|style|sub|summary|sup|table|tbody|td|textarea|tfoot|th|thead|time|title|tr|track|tt|u|ul|var|video).*?<\/\2>/i.test(htmlStringHere)
这包含了所有的 HTML标签,首先是空的,其次是需要结束标签的其他标签。
在这里解释演示: http : //regex101.com/r/pE1mT5
上面的zzzzBov的答案是好的,但是它并没有考虑stream浪的结束标签,例如:
/<[az][\s\S]*>/i.test('foo </b> bar'); // false
也可以捕捉结束标签的版本可能是这样的:
/<[az/][\s\S]*>/i.test('foo </b> bar'); // true
/<\/?[^>]*>/.test(str)
只检测它是否包含html标签,可能是一个xml
如果你是从string文字创build一个正则expression式,你需要转义任何反斜杠:
var htmlRegex = new RegExp("<([A-Za-z][A-Za-z0-9]*)\\b[^>]*>(.*?)</\\1>"); // extra backslash added here ---------------------^ and here -----^
如果您使用正则expression式,这不是必需的,但是您需要转义正斜杠:
var htmlRegex = /<([A-Za-z][A-Za-z0-9]*)\b[^>]*>(.*?)<\/\1>/; // forward slash escaped here ------------------------^
另外你的jsfiddle不起作用,因为你在另一个onload
处理程序中分配了一个onload
处理程序 – 在左边的Frameworks&Extensions面板中设置的默认值是在一个onload
包装JS。 将其更改为nowrap选项,并修复string字面转义和“工作”(在每个人都在评论中指出的约束): http : //jsfiddle.net/wFWtc/4/
据我所知,JavaScript正则expression式没有反向引用。 所以你expression这个部分:
</\1>
不会在JS中工作(但会在其他一些语言中工作)。
这是我时常使用的一个马虎的单线程:
var isHTML = RegExp.prototype.test.bind(/(<([^>]+)>)/i);
它基本上会返回true
的string,其中包含一个<
后跟ANYTHING
后面>
。
通过ANYTHING
,我的意思是基本上除了空string以外的任何东西。
这不是很好,但它是一个单线。
用法
isHTML('Testing'); // false isHTML('<p>Testing</p>'); // true isHTML('<img src="hello.jpg">'); // true isHTML('My < weird > string'); // true (caution!!!) isHTML('<>'); // false
正如你所看到的,这远远不够完美,但在某些情况下可能会为你做好工作。
使用jQuery:
function isHTML(str) { return /^<.*?>$/.test(str) && !!$(str)[0]; }
在这种情况下使用jQuery,最简单的forms是:
if ($(testString).length > 0)
如果$(testString).length = 1
,这意味着textStging
中有一个HTML标记。