时间戳

首页 > 解决方案 > 仅电子打印到 pdf 选择

javascript - 仅电子打印到 pdf 选择

问题描述

我需要在电子中导出为 PDF，但不是整个页面，而只是一个部分（HTML 节点会很棒）。整个页面都可以正常工作。我在文档中看到了一个选项：printSelectionOnly：

printSelectionOnly Boolean (可选) - 是否只打印选择。

电子文档

但我不知道它是否真的会如何工作。我该如何选择？它可能是一个 HTML 节点吗？

提前致谢。

更新

printSelectionOnly 选项是仅选择窗口中的焦点内容以打印/导出为 PDF。

这回答了我的问题。

标签： javascriptpdfelectron

解决方案

printSelectionOnly 选项仅打印页面中已选择的内容。

他们所说的“仅选择”是指页面中当前以蓝色突出显示的所有元素，您可以使用 ctrl+c 进行复制。

所选文本的图像

要使其成为 HTML 节点，您需要创建一个范围对象。然后，使用范围对象选择节点。这将允许您仅打印页面的一个节点。

function selectDiv() {
  selectElementById("frame");
}

function selectChildDiv() {
  selectElementById("childDiv");
}

function selectElementById(id) {
  let element = document.getElementById(id); 
  // Create the range object
  let range = new Range();
  // Select the node using the range object
  range.setStart(element, 0);
  range.setEndAfter(element, 0);
  // Apply the range
  document.getSelection().removeAllRanges();
  document.getSelection().addRange(range);
  // This is where you would call the printToPDF
}
button, #frame {
  margin: 15px 0;
}

div {
    border: 1px solid black;
    box-shadow: 2px 2px 4px fuchsia;
    padding: 5px;
}

i {
  position: relative;
}

i::after {
  content: "I can not be selected";
  position: absolute;
  bottom: 100%; right: 0%;
  font-style: normal;
  font-size: small;
}
<button onclick="selectDiv()">Select parent div</button>
<button onclick="selectChildDiv()">Select child div</button>
<p>Element before div</p>
<div id="frame">
  Inner Text
  <p>Element inside div</p>
  <i>Note : Unselectable elements like pseudo elements won't be selected.</i>
  <div id="childDiv">Div inside div</div>
</div>
<p>Element after div</p>

推荐阅读