Question

我有一个iframe，用于从其父页面生成PDF。 PDF制作者（ABCpdf）需要一个HTML文件，然后将其转换。

我目前所做的是使用以下方法抓取父母的HTML：

var temp;
temp=parent.document.body.parentNode.innerHTML;

然后我使用iframe中的表单将其提交到服务器进行按摩，以便在保存为PDF制作工具的临时HTML文件之前删除iframe部分等内容。

然而，生成的HTML代码被破坏，<BODY>代替<body>等，并删除了ID周围的引号等。

有没有更好的方法来获取HTML？

我不仅仅以HTML格式重新生成页面的原因是父页面是一个复杂的报表。它包含各种控件，允许用户显示/隐藏表中的行或排序行。所以我得到的HTML必须反映用户自定义。

感谢

Answer 1

访问页面的DOM并序列化为HTML将以浏览器所需的任何方式获取数据以将其序列化。就规范而言，大写标签名称和省略属性值周围的可选引号是正确的。

如果您需要原始来源，则需要使用XHR发出HTTP请求以获取新内容。

Answer 2

正如大卫提到的那样，使用innerHTML，你几乎就是浏览器的怜悯。如果要控制序列化，可以自己遍历父文档的DOM，将节点的字符串表示附加到缓冲区。这将花费更长时间并涉及更多代码，但将导致对输出的完全控制。

像这样（伪代码）：

function serializeAttributes(node, buffer) {
  for (attribute in node.attributes) {
    buffer.append(' ' + attribute.name + '="' + attribute.value + '"');
  }
}

function serializeChildren(node, buffer) {
  for (child in node.childNodes) {
    if (child is a text node) {
      buffer.append(child.value);
    } else if (child is an element) {
      // You can also add checks to avoid going into IFrames, etc.
      serializeElement(child, buffer);
    }
  }
}

function serizalizeElement(node, buffer) {
  buffer.append('<' + node.tagName); 
  serializeAttributes(node, buffer);
  if (node.hasChildren) {
    buffer.append('>');
    serializeChildren(node, buffer);
    buffer.append('</' + node.tagName + '>');
  } else {
    buffer.append('\>');
  }
}

serializeNode(window.parent.document);

从iframe中刮取父页面html

2 个答案: