Question

我试图通过JS打印阴影dom的内容。

＆＃xA;＆＃xA;

看似简单：

＆＃xA;＆＃xA;

 < code> var reportBody = document.getElementById（'daily-report-old'）。shadowRoot.innerHTML.toString（）。trim（）;＆＃xA;

＆＃xA;＆＃xA;

在此之后，我在 reportBody 变量中拥有了我想要的全部内容。

＆＃xA;＆＃xA;

然后，我将尝试打印它：< / p>＆＃xA;＆＃xA;

  var mywindow = window.open（''，'PRINT'，'height = 400，width = 600'）;＆＃xA; mywindow.document。 write（'＆lt; html＆gt;＆lt; head＆gt;＆lt; title＆gt;'+ document.title +'＆lt; / title＆gt;'）;＆＃xA; mywindow.document.write（'＆lt; / head＆gt;＆lt; body＆gt ; '）;＆＃XA; mywindow.document.write（reportBody）;＆＃XA; mywindow.document.write（' ＆LT; /体＆GT;＆LT; / HTML＆GT;'）;＆＃XA; mywindow.document.close （）;＆＃XA; mywindow.focus（）;＆＃XA; mywindow.print（）;＆＃XA; mywindow.close（）;＆＃XA;

＆＃XA;＆ #xA; 这段打印代码我发现这里。
＆＃XA;＆＃XA; 我得到的只是一个空白/空白页面。我怀疑阴影dom中的一些硬编码css正在扮演一些恼人的角色。
＆＃xA;＆＃xA; 有人知道打印影子dom内容的正确方法吗？此致＆＃XA;

Answer 1

嗯，这对我来说似乎很棘手但是：

var reportBody = document.getElementById('daily-report-old').shadowRoot.innerHTML.toString().trim();
var mywindow = window.open('', 'PRINT', 'height=400,width=600');
mywindow.document.write('<html><head><title>' + document.title + '</title></head><body>' + reportBody + '</body></html>');
mywindow.document.close();
mywindow.focus();
setTimeout(function () {
    mywindow.print();
    mywindow.close();
}, 2000);

解决了这个问题。

希望有人能给出更好的答案。

如何使用JavaScript打印带有<style>标签的Shadow DOM？

1 个答案: