[JavaScript] 특정 div의 내용을 일정 시간마다 새로고침하기

페이지 정보

루루아빠 14,832 1 2016.03.20 06:24

평점

  • 평점 : 0점 (0명 참여)

본문


<div class="sample">
내용
</div>
위와 같은 소스가 있다면 다음과 같이 추가한다

<div class="example">
    <div id="sample">
    내용
    </div>
</div>
<script>
function autoRefresh_sample_div()
{
var currentLocation = window.location;
$("#sample").fadeOut('slow').load(currentLocation + ' #sample').fadeIn("slow");
}
setInterval('autoRefresh_sample_div()', 30000); //30초 후 새로고침
</script>
상기 소스의 div id값 sample을 사용자 임의로 정한 값으로 변경하면 된다.
<div  id="sample" class="example">과 같이 하지 않고 따로 <div>로 감싼 이유는 원 <div class="example">내용</div>가 의도치 않은 모양으로 나타날 수 있기 때문이다.
또한 .fadeOut('slow')와 .fadeIn("slow")는 굳이 필요한 스크립트는 아니나 효과를 주기 위함이고 slow 대신 fast, 혹은 숫치 값을 입력해도 된다.


 
추천인 1
  • 비회원
6
루루아빠 - 회원등급 : 최고관리자 - 포인트 : 1,291,261
레벨 96
경험치 1,390,416

Progress Bar 78%

- 가입일 : 2015-03-04 03:24:54
- 서명 : KNOW YOUR LIMITS BUT NEVER STOP TRYING TO EXCEED THEM !!
- 자기소개 : 루루의 자랑 루루아빠랍니다~~

댓글

첫 번째 댓글을 남겨 주세요

Total 1311 페이지
제목 글쓴이 날짜 조회 추천
JavaScript  댓글+2🏆 Prism.js 플러그인 Copy to Clipboard Button 이용 시 빈칸이 추가되는 문제 해결하기 shadow2fox 2021.06.22 1,148 2
JavaScript  댓글+1 텍스트 타입의 input 태그에 텍스트 입력 시 앞뒤 공백제거 shadow2fox 2021.06.20 893 1
JavaScript  댓글+2🏆 이미지 원본 크기로 보기 shadow2fox 2021.03.14 1,601 2
JavaScript  🏆 오프스크린 이미지(Offscreen Images) 지연하기 shadow2fox 2018.12.27 3,376 2
JavaScript  🏆 현재창 아이프레임 유무 확인 shadow2fox 2018.12.26 1,702 0
JavaScript  🏆 사용자의 브라우저를 검출하는 방법 shadow2fox 2018.08.22 1,819 0
JavaScript  🏆 반응형 테마에서 Theia Sticky Sidebar 사용시 레이아웃이 중첩되는 문제 해결하기 루루아빠 2017.04.22 2,423 0
JavaScript  🏆 gifplayer를 통해 동영상 재생시 오디오 문제 루루아빠 2016.08.06 2,628 0
JavaScript  🏆 모달창(Modal Window) backdrop(모달창 바깥 부분) 클릭시 모달창 닫지 않기 루루아빠 2016.05.06 3,410 0
JavaScript  🏆 🚩 특정 div의 내용을 일정 시간마다 새로고침하기 루루아빠 2016.03.20 14,833 1
JavaScript  🏆 마우스 오른쪽 버튼 사용시 경고 메세지 띄우기 루루아빠 2015.10.31 2,546 0
JavaScript  🏆 아이프레임 자동으로 갱신하기 루루아빠 2015.06.05 3,182 0
JavaScript  댓글+3🏆 단축키로 페이지 이동 루루아빠 2015.05.28 4,069 0