안녕하세요 저자님.
p.469 실습 5번문제 질문드립니다.
https://ancandy.github.io/web1/s5.html (정상)
https://ancandy.github.io/web1/s5%EC%97%90%EB%9F%AC.html (에러)
realTime함수에서
window.setTimeout("realTime(div)", 1000); 이렇게 하면 시간이 안바뀌고 콘솔창에
오류가 갑니다. (obj로 바꿔도 오류)
그런데, <div>태그 id값인 "a"를 주면 잘작동합니다.
Q. 왜 id값을 주면 작동하는건가요?
var div = null;
function init(){
div = document.getElementById("a");
realTime(div);
}
function realTime(obj){
var date = new Date();
obj.innerHTML = date.toLocaleTimeString();
window.setTimeout("realTime(div)", 1000);
}
2. 독자가 작성한 정상 코드가 사실은 정상이라고 하기에는 좀...
왜냐하면 다음 부분에서 a의 존재는 표준인지 확실치 않네요.
window.setTimeout("realTime(a)", 1000);
a라는 변수가 선언되지 않았으니 realTime() 함수가 호출될 때 a가 넘어가는데 브라우저의 자바스크립트 엔진은 a의 존재를 무엇이라고 판단할까요?
아마도 id=a인 div 객체로 처리한 것 같습니다. 이런 방식은 과거 HTML4에서 사용하던 방식인데 현재로 사용하고 있는지 불확실합니다.
그래서 정답은 1.에서 제시한 것처럼 웹페이지가 적재된 직후 실행된 init()에서 id=a인 객체를 확실히 찾고 이 객체를 가리키는 변수 div를 전역변수로 선언하고
realTime() 함수에 div 를 전달하는 것으로 하면 명확히 정리됩니다.