如何用Javascript解析HTML？
问题的提出是我需要将另一个网页的某些内容解析出来并集成到当前正在处理的网页中。第一想法就是，使用dojo.xhrGet得到网页的内容，再使用某种Javascript Library来解析。我熟悉的dojo并没有这种库，查询了一下，jQuery也没有。后来发现jQuery的作者，鼎鼎大名的John Resig有这样一个库，支持SAX语法和DOM树的构建：
Pure JavaScript HTML Parser
拿我要试验的网页试了一下，很可惜，它crash掉了（这个网页有好几十K大小，也不一定很规范）。不仅想念起Java来，在Java下我们的兵器库里会有一堆这样的东西，有不少甚至支持cssrendeing和Javascript执行。
怎么办？我的需求并不复杂，也许正则表达式就可以用了，但是想起复杂的css查询，以及要兼容网页未来可能的变化，所以这一方法并不值得去试。
突然想起来，browser就是最完美的HTML解析器，如果让browser新开一个窗口加载这个网页，然后再使用DOM API来分析网页，这样要获取我所需要的内容一定会更加准确、灵活，将来网页改变后，程序的修改也显然会更容易。当然，新开窗口的做法不太优雅（甚至会引起用户的错愕），我们使用frame来实现。
Frame共有两类，分别由frameset，frame标签或iframe标签创建。如果一个HTML文件中含有frameset，则该文件只应含有<head>,<frameset>和<frame>标签，不应该有<body>标签。而iframe则用来创建一个内联frame，它包含在<body>标签内。
很多教科书讲关于<frameset>创建的frame的内容，以及各个frame之间window和document的关系，比如《Javascript高级程序设计》（Nicholas Zakas）。而通过iframe创建的frame有以下关系：
原始文档对应的窗口对象，以下简称iWindow，它拥有下列对象：
iWindow.frames: 拥有的子frame数组。可以用frames.length == 0判断一个窗口是否有frame。
iWindow == top
iWindow == iWindow.parent
被创建的frame的文档对象，根据DOM规范，由frameNode.contentDocument来引用，其窗口对象应为frameNode.contentWindow，但注意各浏览器的实现不尽相同。这也正是dojo可以帮忙的地方。下面来看看dojo的实现：
创建iframe www.2cto.com
dojo.io.iframe.create(/*String*/fname, /*String*/onloadStr, /*String?*/uri)
第一个参数是你将要为该frame指定的名字。实际上dojo同时也将该名字当成该iframe的id属性使用。因此，你不可以多次使用同一名字来创建iframe。第二个参数指定了当该iframe内容加载完毕时应该触发的事件，它可以是一小段javascript程序。第三个参数可选，如果不指定，则其会加载dojo.js所在域的某个指定位置下的一个空白html文件。如果你是跨域加载dojo的话（在CDN使用越来越频繁的情况下，跨域加载变得更加常见），这会引起一个安全错误。也许可以将这个参数指定为“about:blank’，firefox和ie都支持这个语法。
操纵iframe文档对象
应该始终使用dojo提供的方法来获取对iframe文档对象的引用，这是因为各个浏览器对象层次结构不同。
dojo.io.iframe.doc(/*DOMNode*/myFrame);
这里的myFrame是先前通过create函数创建的一个DOMNode。记住inline frame就是当前文档对象中的一个结点。如果有兴趣看一下dojo的源代码，它对不同浏览器是这样实现对这个文档的选择的：
doc: function(/*DOMNode*/iframeNode){
//summary: Returns the document object associated with the iframe DOM Node argument.
var doc = iframeNode.contentDocument || // W3
(
(
(iframeNode.name) && (iframeNode.document) &&
(dojo.doc.getElementsByTagName("iframe")[iframeNode.name].contentWindow) &&
(dojo.doc.getElementsByTagName("iframe")[iframeNode.name].contentWindow.document)
)
&nbs
相关新闻>>
- 发表评论
-
- 最新评论 更多>>
