在打印预览中遇到 Chrome 包含样式的问题

Question

以下代码在 Firefox Mozilla 上运行良好，但不适用于 Chrome 或 IE：

printWindow.document.write('<link rel="stylesheet" href="/css/styles.css">');

控制台中的消息是：

[弃用] 从 HTML 导入中定义的样式表样式化主文档已弃用

如果我这样做，它适用于所有浏览器：

printWindow.document.write('<style>body {background:red}</style>');

知道我将如何解决这个问题吗？

Answer 1

我不确定我是否完全理解您的问题，但我确实将以下Pen放在一起作为我如何解决此问题的示例。 如您所见，我能够在新窗口中使用外部 css 库。 在 Chrome 70 和 Edge 中进行了测试，但我没有在 IE 中进行测试的可靠方法。

您可以忽略从原始窗口中提取内容的 javascript 部分，我只是假设这是您将使用的功能。

var printWindow = window.open("", "PrintWindow", "width=400,height=400");
printWindow.document.write('<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitterbootstrap/4.1.2/css/bootstrap.min.css">');