ใช้ JS ดั้งเดิมเพื่อรับองค์ประกอบของหน้าเด็ก iframe ในหน้าหลักและเพื่อรับองค์ประกอบของหน้าหลักในหน้าเด็ก นี่เป็นวิธีที่มักใช้ นี่คือตัวอย่างที่จะสรุป:
1. หน้าหลัก (demo.html) ปรับเปลี่ยนสีพื้นหลังของหน้าเด็ก div บนหน้าหลักให้เป็นสีเทาและกลายเป็นสีแดง:
<! doctype html public "-// w3c // dtd xhtml 1.0 transitional // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> xmlns = "http://www.w3.org/1999/xhtml"> <head> <meta http-equiv = "content-type" content = "text/html; charset = utf-8"/> <title> document.getElementById ('iframeid'). contentWindow; var _div = _iframe.document.getElementById ('objid'); _ div.style.backgroundcolor = '#ccc';} </script> </head> src = "demo-iframe.html" id = "iframeid"> </iframe> </body> </html>2. หน้าย่อย (demo-iframe.html) , ปรับเปลี่ยนสีตัวอักษรของหน้าหลัก div บนหน้าเด็กเป็นสีแดงและกลายเป็นสีดำ:
<! doctype html public "-// w3c // dtd xhtml 1.0 transitional // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> xmlns = "http://www.w3.org/1999/xhtml"> <head> <meta http-equiv = "content-ype" content = "text/html; charset = utf-8"/> <title> function () {var _iframe = window.parent; var _div = _iframe.document.getElementById ('pardiv'); _ div.style.color = 'red';} </script> </head> style = 'ความกว้าง: 100px; ความสูง: 100px; พื้นหลังสี: สีแดง;'> หน้าย่อย </div> </body> </html>3. แผนภาพการทำซ้ำ:
(1) การเรนเดอร์เมื่อไม่เพิ่ม JS:
(2) การแสดงผลหลังจากเพิ่ม JS:
บทความข้างต้น "Native JS" ได้รับองค์ประกอบ DOM ใน iframe - หน้าพ่อและลูกชายได้รับองค์ประกอบ DOM ของกันและกันคือเนื้อหาทั้งหมดที่ใช้ร่วมกันโดยบรรณาธิการ ฉันหวังว่ามันจะให้ข้อมูลอ้างอิงแก่คุณและฉันหวังว่าทุกคนจะสนับสนุน wulin.com มากขึ้น