tampermonkey 使用原生JS打印节点 不使用 jspdf 和 html2canvas等第三方库
时间: 2024-01-22 18:21:26 浏览: 38
要在 Tampermonkey 中使用原生 JavaScript 打印节点,可以使用以下步骤:
1. 获取要打印的节点
```javascript
let node = document.getElementById('my-node');
```
2. 创建一个空的窗口
```javascript
let printWindow = window.open('', '', 'height=400,width=800');
```
3. 在新窗口中添加节点
```javascript
printWindow.document.write(node.outerHTML);
```
4. 打印窗口
```javascript
printWindow.print();
```
完整的代码如下:
```javascript
// 获取要打印的节点
let node = document.getElementById('my-node');
// 创建一个空的窗口
let printWindow = window.open('', '', 'height=400,width=800');
// 在新窗口中添加节点
printWindow.document.write(node.outerHTML);
// 打印窗口
printWindow.print();
```
这样就可以使用原生 JavaScript 在 Tampermonkey 中打印节点了。
相关问题
tampermonkey 使用原生JS打印节点 不使用 jspdf 和 html2canvas等第三方库,带上原始节点的样式
要使用原生JS打印节点并带上样式,可以使用`window.print()`方法,但是这个方法只能打印当前页面的内容。如果要打印单独的节点,可以先将该节点的HTML内容复制到一个隐藏的`iframe`中,然后调用`window.print()`方法。
以下是一个示例代码:
```javascript
function printNode(node) {
// 创建一个隐藏的 iframe
var iframe = document.createElement('iframe');
iframe.style.display = 'none';
document.body.appendChild(iframe);
// 获取节点的HTML内容
var content = node.outerHTML;
// 在 iframe 中写入节点的HTML内容
var doc = iframe.contentDocument || iframe.contentWindow.document;
doc.open();
doc.write(content);
doc.close();
// 等待 iframe 加载完成
iframe.onload = function() {
// 打印 iframe 中的内容
iframe.contentWindow.print();
// 删除 iframe
document.body.removeChild(iframe);
};
}
```
使用示例:
```javascript
var node = document.getElementById('myNode');
printNode(node);
```
这个方法可以将节点的样式打印出来,但是有些浏览器可能会忽略一些CSS属性,如背景图片等。如果需要更精细的控制,可以使用第三方库,如`html2canvas`和`jsPDF`。
相关推荐
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![rar](https://img-home.csdnimg.cn/images/20210720083606.png)
![rar](https://img-home.csdnimg.cn/images/20210720083606.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)