Javascript jQuery为表的每个th元素打印一个具有背景色的指定div

我正在使用一个打印按钮来打印包含所有内容的div

这是我的剧本：

var divToPrint=document.getElementById("print_div");
   newWin= window.open("");
   newWin.document.write(divToPrint.outerHTML);

  var css = "table, td, th { \n"+
  "    border: 1px solid black; \n"+
  "    txt-align:justify; \n"+
  "} \n"+
  "th {  \n"+
  "    background-color: #7a7878; \n"+
  "    text-align:center; \n"+
  "}";
   var div = $("<div />", {
    html: '&shy;<style>' + css + '</style>'
    }).appendTo( newWin.document.body);
   newWin.print();
   newWin.close();

var divToPrint=document.getElementById（“print_div”）；
newWin=window.open（“”）；
newWin.document.write（divToPrint.outerHTML）；
var css=“表，td，th{\n”+
“边框：1px纯黑色；\n”+
“txt align:justify；\n”+
“}\n”+
“th{\n”+
“背景色：#7a7878；\n”+
“文本对齐：居中；\n”+
"}";
var div=$（“”{
html:'­；'+css+''
}).appendTo（newWin.document.body）；
newWin.print（）；
newWin.close（）；

当我点击打印按钮时：我几乎看不到：

然后在一秒钟内，打印屏幕显示：

原始背景颜色为蓝色而不是深灰色，但即使深灰色也不会显示在打印屏幕上

我尝试了这个，是的，表单改变了，但仍然看不到任何背景颜色：

$("#print_div").show();
$("#print_div").show().append("<link rel='stylesheet' href='../css/bootstrap.min.css' media='print' />");
window.print();

$（“#print_div”）.show（）；
$（“#print_div”）.show（）.append（“”）；
window.print（）；

大多数类似的问题仍然不适合我。

试试这个

 var css = "@media print {" +
  "table, td, th { \n"+
  "    border: 1px solid black; \n"+
  "    txt-align:justify; \n"+
  "} \n"+
  "th {  \n"+
  "    background-color: #7a7878; \n"+
  "    text-align:center; \n"+
  "}" +
  "}";
var style =$('<style>').html(css);
style.appendTo(newWin.document.head)

var css=“@media print{”+
表，td，th{\n+
“边框：1px纯黑色；\n”+
“txt align:justify；\n”+
“}\n”+
“th{\n”+
“背景色：#7a7878；\n”+
“文本对齐：居中；\n”+
"}" +
"}";
var style=$（''）.html（css）；
style.appendTo（newWin.document.head）

您需要打开设置以打印背景色

例如，在Chrome浏览器中，请执行以下步骤：

按Ctrl+p键可打开打印窗口

在左窗格中，单击更多设置…

选中背景图形

边缘浏览器

单击右上角的三个点

使用Internet Explorer打开

齿轮图标>打印>页面设置

选中打印背景色和图像

Internet Explorer

---

从第3步开始，对于边缘浏览器

您是否尝试过使用

@media print{…}

自定义样式。不，我没有。如何做到这一点只需在

@media print{…}

中直接编写要在打印视图中显示的样式即可。我可以使用脚本应用这个吗？