Question

我有一个私人使用的扩展程序，有时需要将svg文档转换为html文档。

如果我检测到该页面不包含body元素，并且location.href包含文本＆＃34; .svg＆＃34; （该文件是SVG文件）我尝试以下

document.removeChild(document.firstChild);
var body = document.createElement("body")
var html = document.createElement("html");
html.appendChild(document.createElement("head"));
html.appendChild(body);
document.appendChild(html);

这似乎有效。检查页面显示标准文档

<html>
   <head></head>
   <body></body>
</html>

但是当我尝试访问document.body.style时，我得到一个null referance错误。 document.body等于null公平，然后尝试直接设置document.body元素

// leading on from first snippet
document.body = body;  // line 8712

我得到Uncaught TypeError: Failed to set the 'body' property on 'Document': The provided value is not of type 'HTMLElement'. at contentscript.js:8712

我似乎无法从空文档创建可用的HTML文档。可能吗？

我真的需要该页面，因为重定向将删除域和关联的会话。

Answer 1

请参阅使用

的http://alohci.net/static/Blindman67_1.svg

<svg xmlns="http://www.w3.org/2000/svg">
    <script type="application/ecmascript">
      document.removeChild(document.firstChild);
      var body = document.createElementNS("http://www.w3.org/1999/xhtml", "body")
      var html = document.createElementNS("http://www.w3.org/1999/xhtml", "html");
      html.appendChild(document.createElementNS("http://www.w3.org/1999/xhtml", "head"));
      html.appendChild(body);
      document.appendChild(html);
      var i = document.createElementNS("http://www.w3.org/1999/xhtml", "i");
      i.appendChild(document.createTextNode("Italic text"));
      document.body = body; // Needed for Firefox. Not needed for Chrome
      document.body.appendChild(i);
    </script>
</svg>

将元素放在正确的命名空间中。

SVG文档中的document.createElement（）（即非XHTML，XML文档）将在null命名空间中创建元素，在HTML命名空间中需要它们。

Answer 2

这是我使用的：

{
    let namespaceURI="http://www.w3.org/1999/xhtml", //There's `document.lookupNamespaceURI(null);`.
        html=document.createElementNS(namespaceURI,"html"),
        head=document.createElementNS(namespaceURI,"head"),
        body=document.createElementNS(namespaceURI,"body");
    html.appendChild(head);html.appendChild(body);
    document.documentElement.replaceWith(html); //“Only one element on document allowed.”
    document.head=head;document.body=body;
}

从空SVG文档创建HTML页面的正确方法

2 个答案: