오늘 나는 일을하는 데 문제가있었습니다. 테이블에 여러 행의 데이터를 동적으로 추가하고 먼저 테이블을 정의했습니다.
123456 | <table> <thead> </head> <tbody id = filelist> </tbody> </table> |
그런 다음 JavaScript에서 :
12345 | for (entries in altries) {... var filetable = document.getElementById ( 'filElist'); filetable.innerhtml += '<tr> <td> 111 </td> <td> 222 </td> </tr>';} |
Firefox에는 아무런 문제가 없지만 IE에 넣는 것은 불가능합니다. 동료 들에게 + 검색을 요청한 후 이러한 요소의 내부 속성이 읽기 전용이며 즉 바로 아래에서 작동 할 수 없음을 발견했습니다. 그러나 해결책은 없습니다. TD의 InnerHTML은 여전히 작동 할 수 있습니다. 위의 코드는 다음과 같이 수정할 수 있습니다.
123456789101112 | for (entries in altries) {... 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);} |
먼저 Dom의 CreateElement 메소드를 사용하여 TR 및 TD를 생성 한 다음 TD의 내부에서 해당 작업을 수행하고 마지막으로 AppendChild 메소드를 사용하여 생성 된 요소를 DOM 트리에 추가합니다. 이런 식으로 정상적으로 실행될 수 있습니다. 테이블이 tbody가없는 경우 다음을 수행합니다.
1 | <테이블 id = filleList> </table> |
이 시점에서는 IE6의 테이블 요소가 AppendChild 메소드를 지원하지 않기 때문에 테이블에서 AppendChild 메소드를 직접 사용할 수 없습니다 (IE8은 이미 지원 한 것 같습니다).
인터넷에있는 일부 사람들은 또한 insertrow () 및 기타 방법을 사용하기 위해 제안했지만이 방법은 다른 브라우저 (Insertrow (-1)와의 호환성에 문제가있어서 Firefox에서 필요합니다).
BTW, 나는 이전에 의식적으로 많은 JS 정보를 읽었지만 여전히 진실을 깨달았습니다. 이제 방금 바쁘기 시작했고 공부에 침착합니다.