编辑：

Question

我正在尝试打印页面上显示的一系列div。 div存储在父级（＆＃39; printDialog＆＃39;）中，并存储为＆＃39; prtContent＆＃39;，以便在新窗口中显示。


        $(document).on("click","#modalBtnPrint",function() {
            var prtContent = document.getElementById("printDialog").innerHTML;
            var WinPrint = window.open('', '', 'right=0,top=0,width=800,height=900,toolbar=0,scrollbars=0,status=0');
            if(WinPrint != null) {
                WinPrint.document.write(prtContent);
            }
            WinPrint.focus();
            WinPrint.print();
            WinPrint.close();
    });

我的问题是：

在JS中如何设置内部div类的样式？（即 - div class =＆＃34; formGroup＆＃34;带边框）

编辑：

在T.Chmelevskij的帮助下，这就是我的工作：

$(document).on("click","#modalBtnPrint",function() {
        var prtContent = document.getElementById("printDialog").innerHTML;
        var WinPrint = window.open('', '', 'left=0,top=0,width=800,height=900,toolbar=0,scrollbars=0,status=0');
        if(WinPrint != null) {
            WinPrint.document.write(prtContent);
            var x = WinPrint.document.querySelectorAll(".update");
            for (i = 0; i < x.length; i++) {
                x[i].style.borderStyle = "solid";
            }
            var x = WinPrint.document.querySelectorAll(".required");
            for (i = 0; i < x.length; i++) {
                x[i].style.fontWeight = "bold";
            }
        }
        WinPrint.document.close();
        WinPrint.focus();
        WinPrint.print();
        WinPrint.close();
    });

谢谢大家！

Answer 1

您的WinPrint变量保留对所需窗口的引用。如下所示：

WinPrint.window.document.querySelector('body').style.backgroundColor = "red";

作品。

但正如@epascarello所提到的，如果只是为了打印输出样式，那么css'@ media'打印查询是最好的解决方案。

Answer 2

如果要从变量追加样式，可以使用以下代码：

var style = document.createElement('style');
style = **your variable which store css**
document.head.append(style);

这将使你的css点击按钮。以及没有其他css可以覆盖你的css。

如何设置存储在JS变量中的div类的样式？

编辑：

2 个答案: