通过ID从字符串中提取元素?

用户名

我有一个包含以下文本的字符串:

<!DOCTYPE html>
<html>
<head>
    <title>ExtractDiv test</title>
</head>
<body>
    <p>Apples and oranges</p>
    <div id="main">
        <ul style="list-style-type: upper-roman">
            <li>&#196;pfel</li>
            <li>Birnen</li>
        </ul>
    </div>
    <p>Men and women</p>
</body>
</html>

现在,我需要一个JavaScript函数,该函数可以从文本中返回一个具有特定ID的DOM元素作为字符串,例如:

function ExtractElementByIdFromString(HTMLString, IdString)
{
  var ExtractedElement = ???(HTMLString, IdString);
  return ExtractedElement;
}

因此在这种情况下此函数的结果将是:

<div id="main">
    <ul style="list-style-type: upper-roman">
        <li>&#196;pfel</li>
        <li>Birnen</li>
    </ul>
</div>

这可能吗?

笨拙的

您可以使用本地DOMParser解析HTML字符串

var str = "<!DOCTYPE……………" // your HTML string

var doc = new DOMParser().parseFromString(str, "text/html")

然后只需使用常规的DOM方法:

console.log( doc.getElementById("main") )

请注意,使用DOMParser比将字符串插入文档的innerHTML中的某个位置更有效,更安全,因为仅会创建结构-<script>不会执行元素,不会加载图片,CSS不会尝试将其应用于,则不会进行渲染等。

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章