2012-09-07 64 views
3

我有一个HTML文本,如:封库DOM节点

'<div class="a"><span>1</span><div>2</div></div>'

是否有封库中的函数来获得这样的字符串作为输入,并返回一个DOM树在文档中插入?

回答

11

Closure Library提供功能goog.dom.safeHtmlToNode(html)以创建来自goog.html.SafeHtml对象的文档片段(Node),该对象可以使用goog.html.sanitizer.HtmlSanitizer创建,如下所示。

<!doctype html> 
<html> 
<head> 
    <title>Closure Library Dom Test</title> 
    <script src="https://cdn.rawgit.com/google/closure-library/master/closure/goog/base.js"></script> 
    <script> 
    goog.require('goog.dom'); 
    goog.require('goog.html.SafeHtml'); 
    goog.require('goog.html.sanitizer.HtmlSanitizer'); 
    </script> 
</head> 

<body> 
<h1>Closure Library Dom Test</h1> 

<div id="main"> 
</div> 

<script> 
    var sanitizer = new goog.html.sanitizer.HtmlSanitizer.Builder().build(); 
    var fragment = goog.dom.safeHtmlToNode(
     sanitizer.sanitize('<div class="a"><span>1</span><div>2</div></div>')); 

    goog.dom.append(/** @type {!Node} */(document.querySelector('#main')), 
     /** @type {!Node} */(fragment)); 
</script> 

</body> 
</html> 
+1

'goog.dom.htmlToDocumentFragment(htmlString)'现在删除。有没有新的方法呢? –

+0

@red_led示例更新为使用'goog.dom.safeHtmlToNode(html)'代替已删除的'goog.dom.htmlToDocumentFragment'。 –