In khu vực đã chọn trong html javascript

Đoạn mã sau cho biết cách sử dụng 2 tệp CSS khác nhau. một cho màn hình và một cho máy in

Cách sử dụng khá đơn giản, tạo một bản sao của tệp CSS của bạn và xóa tất cả các phần không mong muốn bằng màn hình. không ai; . css"

...

...


...

...

từ chối trách nhiệm. Thông tin trên trang này được cung cấp "nguyên trạng" mà không có bất kỳ hình thức bảo hành nào. Ngoài ra, Arclab Software OHG không đảm bảo, bảo đảm hoặc đưa ra bất kỳ tuyên bố nào về việc sử dụng hoặc kết quả sử dụng về tính đúng đắn, độ chính xác, độ tin cậy, tính hiện tại hoặc các khía cạnh khác. Thấy. Thỏa thuận cấp phép

Ở đây in có nghĩa là những gì chúng tôi làm với ctrl + p trên trình duyệt của chúng tôi. Tôi sẽ không in một số dòng hoặc một cái gì đó trên màn hình. Đây là tính năng in tích hợp sẵn của trình duyệt. Theo đó tôi sẽ in một phần cụ thể của trang web, không phải toàn bộ trang web

Ở đây bạn sẽ học cách in một phần tử div cụ thể trong Javascript

Di chuyển một phần tử đến vị trí chuột trong JavaScript

in phần cụ thể của trang web trong Javascript [Phần mã HTML]

Vì vậy, trước tiên hãy tạo một số phần tử div trong HTML

   Javascript Learn 


  

    Hello
  
  

    HI
    
  
  

Vì vậy, ở đây chúng tôi đã tạo hai phần tử div khác nhau

 Hello 
 
 HI 

Chúng tôi đã sử dụng hai id để xác định các phần tử div đó

Bây giờ, hãy tạo một nút, để bất cứ khi nào chúng ta nhấp vào nút đó, chúng ta có thể in một trong những phần tử div này

  Javascript Learn


  

    Hello
  
  

    HI
    
  
  

    
  

Ở đây chúng tôi tạo một nút

Bây giờ là phần quan trọng nhất, Tạo hàm Javascript để in một phần tử div cụ thể

				
function codespeedy[]{
var print_div = document.getElementById["hello"];
var print_area = window.open[];
print_area.document.write[print_div.innerHTML];
print_area.document.close[];
print_area.focus[];
print_area.print[];
print_area.close[];
		}

	

Vì vậy, đây là chức năng javascript để in một phần tử div cụ thể từ trang web

var print_div = document.getElementById["hello"];

Ở đây chúng tôi đã lưu trữ dữ liệu phần tử của div id hello trong biến print_div

Bây giờ những gì chúng ta cần chỉ là gọi hàm khi nhấp vào nút

Vì vậy, đây là toàn bộ mã

  Javascript Learn


  

    Hello
  
  

    HI
    
  
  
        
    function codespeedy[]{
      var print_div = document.getElementById["hello"];
var print_area = window.open[];
print_area.document.write[print_div.innerHTML];
print_area.document.close[];
print_area.focus[];
print_area.print[];
print_area.close[];
// This is the code print a particular div element
    }

  

    
  

Ở đây tôi chọn, div id “xin chào” sẽ được in

Vì vậy, nó sẽ chỉ in nội dung của id div xin chào

Bạn cũng có thể quan tâm đến,

In nội dung từ một phần tử div cụ thể bằng jQuery

3 phản hồi cho “Cách in phần hoặc phần cụ thể của trang web bằng Javascript”

1. Ben nói.

   Chào -

   Tôi là người mới viết mã và tạo trang web của riêng mình

   Tôi rất vui khi tìm thấy mã của bạn để tạo nút in chỉ in một div trên một trang. Tôi đang sử dụng Squarespace và mã của bạn hoạt động hoàn hảo. Trang web được đề cập của tôi có nhiều ảnh và nút in sẽ cho phép người dùng in ảnh lên một trang đầu ra

   Tôi muốn sửa đổi mã này để xác định rằng tài liệu cuối cùng được in được giới hạn trong một trang. Ngay bây giờ một bức ảnh in trên 3-4 trang

   Tôi rất biết ơn nếu bạn có thể vui lòng cho tôi biết cách sửa đổi mã để thực hiện những việc sau
   1] sửa đổi mã của bạn để đầu ra luôn ở trên một trang;
   2] nếu có thể – ví dụ: nếu mã được sử dụng để in hai hoặc ba div – làm cách nào tôi có thể sửa đổi mã để chỉ định rằng đầu ra in có các div cạnh nhau. Ví dụ: tôi muốn có hai hình ảnh cạnh nhau trong trang in cuối cùng. Ngoài ra, tôi cũng quan tâm đến cách sửa đổi mã để mỗi ảnh [cái mà tôi gọi là div] in ở một khu vực cụ thể – ví dụ: ảnh một chiếm 1/3 trên cùng bên trái của trang, ảnh hai chiếm

   Cảm ơn nhiều

   Tốt,

   Bến

   • Faruque Ahamed Mollick nói.

     Tôi sẽ sớm tìm ra giải pháp và cho bạn biết. Hoặc chúng tôi có thể đợi nếu bất kỳ ai trong cộng đồng của chúng tôi có câu trả lời

     Làm cách nào để chỉ in vùng được chọn trong JavaScript?

     Bạn có thể sử dụng chức năng này để in một khu vực cụ thể của trang web hoặc toàn bộ nội dung trang web. Sử dụng hàm printPageArea[] trong sự kiện title của thành phần nút in và cung cấp ID div của khu vực nội dung mà bạn muốn in .

     Làm cách nào để in một phần cụ thể của trang JavaScript?

     Đặt "phần cụ thể" của bạn vào một phần [một số loại vùng chứa]. Mỗi phần phải có một nút có giá trị khớp với ID của phần đó

     Tạo kiểu cho phần cần thiết mà bạn muốn xuất hiện trên bản in. [về cơ bản đó là cách nó xuất hiện trong cửa sổ trình duyệt]

     Tạo quy tắc in @media

     Tạo hàm javascript js

     Làm cách nào để in một phần bằng JavaScript?

     Để in nội dung của div trong JavaScript, trước tiên hãy lưu trữ nội dung của div trong một biến JavaScript, sau đó nhấp vào nút in . Nội dung của phần tử div HTML sẽ được trích xuất.

     Làm cách nào để in một khu vực cụ thể của trang web bằng jQuery?

     Cách sử dụng. .

     Chỉ định một ID duy nhất cho thành phần html của bạn nơi bạn muốn làm cho nó có thể in được. < div id = "có thể in được" >.

     Tạo một nút để in phần tử html đã chỉ định. .

     Nhập thư viện jQuery mới nhất và plugin in jQuery. .

     Gọi plugin trên nút in và thực hiện. .

     Cài đặt plugin có sẵn