javaScript 새로고침, location.reload();

기존의 검색기에서 북마크를 사용하면 몇 번에 몇 페이지에 저장이 되었는지 알려주는 알림창이 나온다.

일일히 확인 눌러주는 것도 그렇고 이 참에 북마크 도출(result) 부분만 <iframe>으로 별도의 공간으로 만들어 거기다 location.reload();를 적용 해 북마크 버튼을 누를 때 마다 브라우저(부분 페이지)가 새로고침 되도록 만드는 방법을 적용 하려고 하다... 아이프레임에 document.write()을 어떻게 적용 해야 할 지 막막하다. 

그렇다고 죽은 태그인 <frameset>이나 <frame>을 다시 쓰기는 거시기 하고...

그럼 차라리 location.reload();를 북마크 함수 전체에 적용 해 페이지 전체를 리프레쉬하는 방법은 어떨까도 생각 해 봤다.

필자한테는 광고 cpm이 늘기 때문에 득이 될 거라 생각되지만 모바일 환경에서는 로딩 시간이 있어 다소 불편 할 것이라 판단 일단 유보 상태에 있다. 물론 팝업창을 띄워 거기다 <iframe>을 적용 해도 되지만...

일이 커진다.

여튼 javaScript에서 브라우저를 새로고침 하는 기능은 location.reload();다.

만약 특정 <iframe>(프레임)을 새로고침 하고 싶다면,

<iframe id="iframeID">

</iframe>

<script>

document.getElementById('iFrameID').contentDocument.location.reload(true);

</script>

이렇게 넣거나,

<iframe name="iframeID">

</iframe>

<script>

document.getElementByName('iFrameID').contentDocument.location.reload(true);

</script>

프레임에서는 속성으로 src 즉, html 통짜로 적용 되기 때문에 document.write()를 쓸려고도 생각 했지만 이 함수 특성 상 새로운 도큐함수가 소환되면 기존에 덧 되어 나타나는 것이 아니라 기존의 값을 지우고 등장하기에 프레임에 도큐조합으로는 버튼의 value값의 실시간 변경값을 적용하기 어렵다. 이에, 우리는 다음으로 html DOM innerHTML에 대해서 배워야 한다.

 

그렇게 되면 우리는 위의 예제(시계)처럼 실시간 상태반영이 가능한 코드를 짤 수 있게 된다.

위 시계 예제는 간단하다. 아이디를 불러서 그 내용에 1초 간격으로 Date()를 불러오면 된다.

일단은 이 것을 응용하여 오로치마루 옆에 있는 vod에 적용 시켜 놓았다.

이제 알림창 없이 바로 바로 북마크 변경상태를 확인 할 수 있다.