วันนี้ฉันพบปัญหาในการทำสิ่งต่างๆ ฉันพยายามเพิ่มข้อมูลหลายแถวลงในตารางและกำหนดตารางก่อน: ก่อน:
123456 | <bable> <thead> </head> <tbody id = filelist> </tbody> </table> |
จากนั้นใน JavaScript:
12345 | สำหรับ (var i ในรายการ) {... var filetable = document.getElementById ('filelist'); filetable.innerhtml += '<tr> <td> 111 </td> <td> 222 </td> </tr>';} |
ไม่มีปัญหาใน Firefox แต่มันจะเป็นไปไม่ได้ที่จะวางไว้ใต้ IE ฉันถาม เพื่อน ร่วมงาน + ค้นหาและพบว่าคุณลักษณะ InnerHTML ขององค์ประกอบเหล่านี้เป็นแบบอ่านอย่างเดียวและไม่สามารถดำเนินการได้โดยตรงภายใต้ IE แต่ไม่มีทางออก InnerHTML ของ TD ยังคงสามารถใช้งานได้ รหัสข้างต้นสามารถแก้ไขได้เช่นนี้:
123456789101112 | สำหรับ (var i ในรายการ) {... var filetable = document.getElementById ('filelist'); var tr = document.createElement ('tr'); var td1 = document.createelement ('td'); td1.innerhtml = '111'; var td2 = document.createelement ('td'); td2.innerhtml = '222'; Tr.AppendChild (TD1); Tr.AppendChild (TD2); Filetable.appendchild (tr);} |
คุณสามารถใช้วิธีการสร้าง CreateElement ของ DOM เพื่อสร้าง TR และ TD จากนั้นทำการดำเนินการที่สอดคล้องกันบน InnerHTML ของ TD และในที่สุดก็ใช้วิธีการภาคผนวกเพื่อเพิ่มองค์ประกอบที่สร้างขึ้นในแผนผัง DOM วิธีนี้สามารถทำงานได้ตามปกติภายใต้ IE ควรสังเกตว่าหากตารางของคุณไม่มี tbody มันจะทำเช่นนี้:
1 | <table id = filelist> </table> |
ในเวลานี้คุณไม่สามารถใช้เมธอดภาคผนวกโดยตรงบนตารางเนื่องจากองค์ประกอบตารางภายใต้ IE6 ไม่รองรับวิธี AppendChild (IE8 ดูเหมือนจะสนับสนุนแล้ว)
บางคนบนอินเทอร์เน็ตได้เสนอให้ใช้ InserTrow () และวิธีการอื่น ๆ ในการทำ แต่วิธีนี้มีปัญหากับความเข้ากันได้กับเบราว์เซอร์ที่แตกต่างกัน (InserTrow (-1) ใน Firefox) ดังนั้นจึงไม่มีประโยชน์
BTW แม้ว่าฉันจะได้อ่านข้อมูล JS มากมายมาก่อน แต่ฉันก็ยังตระหนักถึงความจริง ตอนนี้ฉันเพิ่งเริ่มยุ่งและฉันสงบในการศึกษาของฉัน