AngularJS $ http HTML Parser

Question

总之,我们正在使用AngularJS开发一个webapp,我们有一个用例/要求(根本不会经常发生),我们需要从静态服务器检索一个完整的HTML文档.但是,$ http对象似乎将原始HTML字符串作为其"数据"返回.我们试图避免使用外部库(例如jQuery),但我们需要将原始HTML字符串解析为可查询的DOM对象.我们可以使用iframe并完成它,但我们也试图避免使用iframe出于众所周知的原因.

所以,问题是:AngularJS是否有HTML解析器(就像JSON一样)？或者,处理这种情况最优雅的方式是什么？

PS:我们尝试过筛选Angular的API文档,但是老实说它们很容易被导致并且无法直接导航.

Answer 1

如果需要以编程方式从字符串中获取DOM元素,则将html解析为DOM对象非常简单.

基本上你会使用DOMParser.

var parser = new DOMParser();
var doc = parser.parseFromString('<div>some html</div>', 'text/html');
doc.firstChild; //this is what you're after.

从那里,如果你想查询从vanilla JS获取元素(意思是,你不想出于某种原因使用JQuery),你可以这样做:

//get all anchor tags with class "test" under a div.
var testAnchors = doc.firstChild.querySelectorAll('div a.test'); 

...但请注意:querySelectorAll仅在IE8及更高版本中受支持.

编辑:其他方法......

"换行"方法:

var div = document.createElement('div');
div.innerHTML = '<div>some html</div>';
var result = div.childNodes;

...请注意,如果您将SVG或MathML放入其中,此方法将返回HTMLUnknownElements.他们"看起来"正常,但他们不会工作.