DOM web worker 内部的操作

Question

我知道workers不能直接操作文档，但是DOMAPI方法呢？他们去哪儿了？！

例如，如果我发出接收 HTML 片段的请求，如果只需要解析它以便从特定节点检索一些数据，我应该怎么做？！

绝对没有办法在网络工作者上使用虚拟DOM？！

Answer 1

起初您可能认为解析 XML 的正确方法是 XMLHttpRequest，在 10 例中有 9 例是正确的。但是，在当前的 Web Worker 规范中，我们无法访问 XMLHttpRequest。另一种方法是使用一些流行的 XML 解析库之一：

https://github.com/isaacs/sax-js

http://xmljs.sourceforge.net/index.html or https://www.npmjs.com/package/xmljs

HTML 就是 XML，所以你可以用这种方式解析你的数据。使用上面 npmjs 中的 xmljs 的示例：

var XmlParser = require("xmljs");
var fs = require("fs");


var p = new XmlParser({ strict: true });
var xml = fs.readFileSync("./SOAP1.xml"); // XML in the examples direct 
var xmlNode = p.parseString(xml, function(err, xmlNode) {
    if(err) {
        console.error(err);
        return;
    }
    var nodes = xmlNode.path(["Envelope", "Body", "GetstockpriceResponse", "Price"], true);
    console.log(nodes.map(function(n) { return n.text; }));
});

Answer 2

浏览器支持

DOMParser 或 document.implementation 通常用于在浏览器中将 HTML 解析为 DOM。在 worker 上下文中均不可用。

在 Firefox 中，这是不可能的，因为有人决定所有线程只有一个 DOM 解析器实例。看到这个错误：https://bugzilla.mozilla.org/show_bug.cgi?id=677123

在google chrome中也不起作用。

解决方法 - 外部库

没错，由于浏览器开发人员没有意识到 DOM 和 XML 解析将成为 WebWorkers 的主要用途之一，我们将不得不回退到外部库。最好的选择似乎是 JSDOM, but you'll need to figure out how to browserify it.

这是我对 DOMParser 的失败尝试，我保留它以备将来关于此主题的实验：https://jsfiddle.net/svaqb2wn/2/

Answer 3

您可以在 Web Worker 中使用 DOM 实现之一运行：

DOM web worker 内部的操作

DOM manipulation inside web worker

javascript

html

web-worker

浏览器支持

解决方法 - 外部库