javascript 字符串变量是否有类似 getElementsByTagName() 的函数？答案

【问题标题】：Is there a getElementsByTagName() like function for javascript string variables?javascript 字符串变量是否有类似 getElementsByTagName() 的函数？
【发布时间】：2009-04-01 03:45:56
【问题描述】：

我可以使用 getElementsByTagName() 函数从网页中的元素中获取元素集合。

我希望能够对 javascript 字符串变量的内容而不是 DOM 元素的内容使用类似的函数。

我该怎么做？

编辑

我可以通过动态创建元素来做到这一点。

var myElement = new Element('div');
myElement.innerHTML = "<strong>hello</strong><em>there</em><strong>hot stuff</strong>";
var emCollection = myElement.getElementsByTagName('em');
alert(emCollection.length); // This gives 1

但为了方便使用 getElementsByTagName() 函数而动态创建元素似乎并不正确，并且不适用于 Internet Explorer 中的元素。

【问题讨论】：

即你要搜索字符串中的文本？
是的。如果有替代功能可用，我只是不想创建正则表达式森林。

标签： javascript string

【解决方案1】：

正如您所展示的，将字符串注入 DOM 是最简单、最可靠的方法。如果您对字符串进行操作，则必须考虑所有可能的转义场景，这些场景会使 看起来 像标签的东西实际上不是成为标签。 p>

例如，你可以有

<button value="<em>"/>
<button value="</em>"/>

在你的标记中——如果你把它当作一个字符串，你可能会认为你有一个<em>标签，但实际上你只有两个按钮标签。

通过innerHTML 注入 DOM，您可以利用浏览器内置的 HTML 解析器，它非常快。通过正则表达式做同样的事情会很痛苦，而且浏览器通常不提供类似 DOM 的功能来查找字符串中的元素。

您可以尝试的另一件事是将字符串解析为 XML，但我怀疑这会比 DOM 注入方法更麻烦且更慢。

【讨论】：

【解决方案2】：

function countTags(html, tagName) {
    var matches = html.match(new RegExp("<" + tagName + "[\\s>]", "ig"));
    return matches ? matches.length : 0;
}

alert(
    countTags(
        "<strong>hello</strong><em>there</em><strong>hot stuff</strong>",
        "em"
    )
); // 1

【讨论】：

【解决方案3】：

var domParser = new DOMParser();
var htmlString = "<strong>hello</strong><em>there</em><strong>hot stuff</strong>";
var docElement = domParser.parseFromString(htmlString, "text/html").documentElement;
var emCollection = docElement.getElementsByTagName("em");
for (var i = 0; i < emCollection.length; i++) {
    console.log(emCollection[i]);
}

【讨论】：

【解决方案4】：

字符串中的 HTML 没什么特别的。它只是字符串中的文本。它需要被解析成一棵树才能有用。这就是为什么您需要创建一个元素，然后在其上调用 getElementsByTagName，如您在示例中所示。

【讨论】：