-URL 제어하기-
var now_url = location.href;
window.location = 'URL'
location.href = 'URL'
-웹 브라우저의 정보 조회-
: 웹 브라우저의 이름, 버전정보, 운영체제 정보 등이 포함된 문자열 값
var agent = navigator.userAgent;
이 값에 특정 단어가 포함되어 있는지 여부를 판단하여 브라우저나 운영체제 종류, 모바일/PC 여부 등을 확인할 수 있다.
var agent = navigator.userAgent;
if (agent.indexOf('검사할 단어') > -1) {
...처리 내용...
}
-타이머 처리-
지정된 시간(1/1000초 단위)마다 한 번씩 콜백 함수를 반복 호출
setInterval(function() {
...구현 내용...
}, 시간);
지정된 시간(1/1000초 단위)만큼 딜레이 후 콜백 함수를 1회 호출
setTimeout(function() {
...구현 내용...
}, 시간);
# 활용 예시
아래의 구문들을 <body> 태그에 onload 이벤트 형태로 적용
5초 후 페이지 자동 새로고침
setTimeout(function() {
location.reload();
}, 5000);
5분에 한 번씩 페이지 새로고침
function set_refresh() {
setInterval(function() {
location.reload();
}, 5*60*1000);
}
<body onload="set_refresh()">
5초 후 다른 페이지로 이동
setTimeout(function() {
location.href = "URL";
}, 5000);
↓↓↓↓↓ JQuery로 대체 가능 ↓↓↓↓↓
-HTML 제어-
#HTML 요소를 객체로 생성하기
var mytag = document.getElementById("id속성값");
#획득한 객체의 내부에 대한 내용 접근
//내용 적용하기
mytag.innerHTML = "...적용할 내용...";
//적용된 내용 조회하기
var content = mytag.innerHTML;
#획득한 객체 CSS 속성 접근
//내용 적용하기
mytag.style.css관련_프로퍼티 = "값"
//적용된 내용 조회하기
var css = mytag.style.css관련_프로퍼티
css관련 프로퍼티의 이름 규칙은 css에서 '-'로 표시되는 부분이 없어지고 대문자가 사용됨
ex) [CSS] background-color ---> [JS] backgroundColor
#획득한 객체의 CSS 클래스 접근
//내용 적용하기
mytag.ClassName = "값";
//적용된 내용 조회하기
var cls = mytag.ClassName;