简体中文（ZH-CN）English（EN）繁体中文（ZH-TW）日本語（JA）한국어（KO）Melayu（MS）Français（FR）Deutsch（DE）
Rumah
Artikel
Soal Jawab
Kursus
Topik
Muat turun
Permainan
Kamus
kemas kini terkini

Rumah  >  Soal Jawab  >  teks badan

Salin kandungan div ke dalam iframe baharu

<p>Akhirnya saya mencuba teknik yang mencetak <kod>div</code> tetapi saya terperangkap pada bahagian soalan ini. </p> <p>Saya mempunyai beberapa kod yang harus disalin daripada <kod>div</kod> kepada <kod>iframe</code>: </p> <pre class="brush:js;toolbar:false;">var iframe = document.createElement('iframe'); var div = document.querySelector('div#sidebar'); kandungan var = div.innerHTML; iframe.srcdoc = `<!DOCTYPE html><html><head></head><body>${content}</body></html>`; document.body.append(iframe); iframe.contentWindow.print(); </pra> <p>Saya mencuba ini dalam alat pembangun pada halaman SO (saya boleh cuba menggunakan <code>div#sidebar</code>). </p> <p>Saya perasan bahawa saya perlu menambah <kod>iframe</code> Jika tidak, sifat <code>.contentWindow</code> ialah <code>null</code>. </p> Kod <p>nampaknya berfungsi sedikit sebanyak, tetapi <kod>iframe</code> Cetakan akhir kosong. </p> <p>Sebarang petua dalam mencipta <kod>iframe</code> dengan kandungan yang disalin? </p>
P粉042455250P粉042455250430 hari yang lalu383

membalas semua(1)saya akan balas

  • P粉306523969

    P粉3065239692023-08-18 12:19:00

    Baiklah, saya ada jawapan. Saya sepatutnya tahu lebih baik kerana saya baru sahaja selesai mengajar topik yang sama.

    Kod berfungsi, tetapi ia berjalan terlalu awal. Saya perlu menunggu sehingga dokumen selesai dimuatkan.

    Berikut ialah versi yang berfungsi: 

    var iframe = document.createElement('iframe');
var div = document.querySelector('div#sidebar');
var content = div.innerHTML;
iframe.srcdoc = `<!DOCTYPE html><html><head></head><body>${content}</body></html>`;

document.body.append(iframe);

//  等待iframe加载完成：
    iframe.onload = () => {
        iframe.contentWindow.print();
        iframe.contentWindow.addEventListener('afterprint', event => {
            iframe.remove();
        });
    };

    balas
    0
  • Batalbalas