반응형

자바스크립트 내장함수 정리

  • window
  • location
  • screen
  • document
  • others

 

window

//window.open : 새창띄우기
window.open('/srctree/login.html', '로그인', 'width=480, height=800');

 

location

//페이지 이동
location.href = 'http://www.abc.com/';

//location 값 확인(현재페이지 : 'https://srctree.tistory.com/main.html')
location //'https://srctree.tistory.com/main.html'
location.host //'srctree.tistory.com'
location.hostname //'srctree.tistory.com'
location.href //'https://srctree.tistory.com/main.html'
location.pathname //'/main.html'
location.protocol //'https:'

 

screen

screen.width //화면의 가로 크기
screen.height //화면의 세로 크기
screen.availWidth //작업 표시줄이 차지하는 부분을 제외한 가로 크기
screen.availHeight //작업 표시줄이 차지하는 부분을 제외한 세로 크기
screen.colorDepth //사용가능한 색상수
screen.pixelDepth //IE는 버전 10 이상에서 사용 가능

 

document

//기본저장값 가져오기 및 설정
document.title; //타이틀 가져오거나 변경
document.URL; //URL 가져오거나 변경
document.characterSet; //문자인코딩 반환('utf-8', ...)

//추가하기
document.write('<p>Hello</p>');//줄바꿈 미적용
document.writeln('<p>Hello</p>');//줄바꿈 적용

//태그로 찾기
document.getElementsByTagName('p') //p태그
document.getElementsByTagName('p')[0] //요소중 첫번째

//쿼리로 찾기
document.querySelector('.xyz') //쿼리셀렉터(xyz클래스)
document.querySelectorAll('.abc); //모두가져오기1
document.querySelectorAll('.abc, .def'); //모두가져오기2

//아이디로 찾기, 속성제어, 내용 가져오기
document.getElementById('xyz'); //id로 요소 가져오기
document.getElementById('abc').childElementCount; //바로 아래 자식 요소의 개수
document.getElementById('abc').getAttribute('class'); //속성 가져오기
document.getElementById('abc').getAttribute('href'); 
document.getElementById('abc').setAttribute('class', 'c1'); //속성 설정
document.getElementById('abc').removeAttribute('class'); //속성 삭제
document.getElementById('abc').innerHTML; //내용 가져오기
 
//button 생성후 텍스트 추가하고 body에 추가
var jbBtn = document.createElement('button');
var jbBtnText = document.createTextNode('Click');
jbBtn.appendChild(jbBtnText);
document.body.appendChild(jbBtn);

 

인코딩/디코딩, 문자/숫자 간 형변환, 기타

//UTF-8을 이용한 인코딩과 디코딩(URL인코드/디코드)
encodeURI() //인터넷 주소에서 사용하는 :, ;, /, =, ?, & 등을 제외하고 인코딩
encodeURIComponent() //모든 문자를 인코딩
decodeURI() //encodeURI()로 인코딩한 문자열을 디코딩
decodeURIComponent() //encodeURIComponent()로 인코딩한 문자열을 디코딩
 
eval('1+2') //문자열을 코드로인식 -> 3
 
isFinite(value) //123.123-> true, Infinity-> false, 'str'-> false

isNaN(value) //숫자아니면 true (Not a number)
 
Number('105') //문자->숫자
String(106) //숫자->문자
parseInt('10'), parseFloat('1.5') //숫자->문자
반응형
  • 네이버 블러그 공유하기
  • 네이버 밴드에 공유하기
  • 페이스북 공유하기
  • 카카오스토리 공유하기