>웹 프론트엔드 >JS 튜토리얼 >JavaScript에서 DIV 요소의 내용을 어떻게 쉽게 인쇄할 수 있습니까?

JavaScript에서 DIV 요소의 내용을 어떻게 쉽게 인쇄할 수 있습니까?

Linda Hamilton
Linda Hamilton원래의
2024-12-15 08:14:12992검색

How Can I Easily Print the Content of a DIV Element in JavaScript?

간편하게 DIV 콘텐츠 인쇄

DIV 콘텐츠 인쇄는 웹 개발에서 흔히 발생하는 작업입니다. 이 과제에 대한 효과적인 솔루션은 다음과 같습니다.

해결책:

제공되는 JavaScript 기능인 PrintElem은 호환성 향상을 위해 약간의 수정을 거쳐 DIV 콘텐츠를 인쇄하는 포괄적인 접근 방식을 제공합니다. 다음과 같은 최신 브라우저 Chrome:

function PrintElem(elem) {
  // Open a new window for printing
  var mywindow = window.open('', 'PRINT', 'height=400,width=600');

  // Write HTML structure to the new window
  mywindow.document.write(`<html><head><title>` + document.title + `</title></head>`);
  mywindow.document.write('<body >');
  mywindow.document.write('<h1>' + document.title + '</h1>');

  // Insert the DIV's innerHTML into the new window
  mywindow.document.write(document.getElementById(elem).innerHTML);

  // Complete the HTML structure and close the window
  mywindow.document.write('</body></html>');
  mywindow.document.close(); // Essential for IE >= 10

  // Focus and print the window
  mywindow.focus();
  mywindow.print();
  mywindow.close();

  return true;
}

사용법:

ID가 "myDiv"인 DIV의 콘텐츠를 인쇄하려면 다음과 같이 PrintElem 함수를 호출하면 됩니다.

PrintElem('myDiv');

위 내용은 JavaScript에서 DIV 요소의 내용을 어떻게 쉽게 인쇄할 수 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.