재미난 내용인거같아 저도한번 올려봅니다. ie 5.0 이상부터 제공되기 시작한 css지시자 expression 또는 setExpression 메소드를 이용하면 좀더 심플하게, 동적으로 변화를 감지할 수 있습니다.
예제를 보시려면 링크#1을 클릭해보세요 setTimeout 없이도 내용의 변화가 즉각 반영되는것을 알 수 있습니다.
expression 을 이용해서 로그인박스 처리나 게시판 입력항목같은 좀더 재미난 부분에 응용이 가능한데.. 그 부분은 나중에 시간이 나면 예제와 함께 소개해 보겠습니다 : )
[소스: frame.html] <script> function syncHeight(el) { el = typeof el == 'string' ? document.getElementById(el) : el; el.setExpression('height','contentWindow.document.body.scrollHeight+5'); } </script> <iframe name="test" id="test" src="content.html" onLoad="syncHeight(this)"></iframe> [/소스]
[소스:content.html] ... 이것은 iframe 내용입니다.<br> 이것은 iframe 내용입니다.<br> 이것은 iframe 내용입니다.<br> 이것은 iframe 내용입니다.<br> <button onClick="this.outerHTML='이것은 추가된내용입니다<br>'+this.outerHTML">누르면 내용이 추가됩니다</button> [/소스]