본문 바로가기
프로그래밍/JavaScript

[자바스크립트 TIP] tbody.innerHTML 이 안된다고??

by zoo10 2010. 12. 17.

스크립트 작업을 하다가 아무리 해도 안되는게 있어서 머리가 지끈거렸다.
그 문제의 녀석은

var l = document.getElementById("list");
var tbody = l.getElementsByTagName("TBODY");
var tr = tbody[0].innerHTML;
var tmp = tr + "하하하";
tbody[0].innerHTML = tmp;

이 지극히 평범해 보이는 구문이었는데. 5번째 줄에서 스크립트 오류가 떨어지는 것이었다. 아~ 젠장 또 오타인가 하고 아무리 들여다 봐도 너무나 짧은 구문에 오타라고 찾아볼 수가 없었다. 뭐지뭐지.. 아무리 이리저리 고쳐봐도 안되는게 머리를 쥐어짜게 만들었다.

그런데 왠걸.. 문제의 해답은 너무나도 간단한 곳에 ㅡㅡ;;
IE 에서는 tbody 태그가 읽기전용이란다. 그래서 읽기는 잘되었는데 쓰기가 안된 것이었다는 ㅡㅡ;;
아 허탈하다.

참고삼아 IE에서 읽기전용 마크업 태그들을 찾아봤다. 그 결과는 아래와 같다.

col, colgroup, frameset, head, html, style, table, tbody, tfoot, thead, title, tr

그래서 tr 같은 경우는

tr.innerHTML = "td"

가 아니라
tr.appendRow(object);

로 써야한다는 말씀. 다른 태그들도 appendChild 같은 메서드로 하위요소를 추가해야 한다.