[JavaScript] Screen 객체
·
Language/JavaScript
Screen 객체 screen 객체는 사용자의 디스플레이 화면에 대한 다양한 정보를 저장하는 객체다. 사용자의 화면 크기 screen 객체의 width와 height 프로퍼티는 사용자의 디스플레이 화면의 크기를 픽셀 단위로 반환한다. document.write("현재 사용자의 디스플레이 화면의 너비는 " + screen.width + "픽셀입니다. "); document.write("현재 사용자의 디스플레이 화면의 높이는 " + screen.height + "픽셀입니다. "); document.write("현재 브라우저 창의 너비는 " + window.outerWidth + "픽셀입니다. "); document.write("현재 브라우저 창의 높이는 " + window.outerHeight + "픽셀입니..
[JavaScript] History 객체
·
Language/JavaScript
History 객체 history 객체는 브라우저의 히스토리 정보를 문서와 문서 상태 목록으로 저장하는 객체다. 자바스크립트는 사용자의 개인 정보를 보호하기 위해 이 객체에 접근하는 방법을 일부 제한하고 있다. 히스토리 목록의 개수 history 객체의 length 프로퍼티는 브라우저 히스토리 목록의 개수를 반환한다. function openDocument() { location.assign("/javascript/js_bom_history"); } document.getElementById("text").innerHTML = "현재 브라우저의 히스토리 목록의 개수는 " + history.length + "개 입니다."; 히스토리 목록 접근하기 history 객체에는 브라우저의 뒤로 가기와 앞으로 가기 ..
[JavaScript] Location 객체
·
Language/JavaScript
Location 객체 location 객체는 현재 브라우저에 표시된 HTML 문서의 주소를 얻거나, 브라우저에 새 문서를 불러올 때 사용할 수 있다. 이 객체는 Window 객체의 location 프로퍼티와 Document 객체의 location 프로퍼티에 같이 연결되어 있다. location 객체의 프로퍼티와 메소드를 이용하면, 현재 문서의 URL 주소를 다양하게 해석하여 처리할 수 있다. 현재 문서의 URL 주소 location 객체의 href 프로퍼티는 현재 문서의 전체 URL 주소를 문자열로 반환한다. document.write("현재 문서의 주소는 " + location.href + "입니다."); 현재 문서의 호스트 이름 location 객체의 hostname 프로퍼티는 현재 문서의 인터넷 호..
[JavaScript] 노드의 조작
·
Language/JavaScript
노드의 값 변경 nodeValue 프로퍼티를 사용하면 특정 노드의 값을 변경할 수 있다. 또한, setAttribute() 메소드는 속성 노드의 속성값을 변경할 수 있게 해준다. 요소 노드의 텍스트 요소 노드는 자신이 직접 텍스트값을 가지지는 않는다. 요소 노드의 텍스트는 요소 노드의 자식 노드인 텍스트 노드(text node)에 저장된다. 따라서 요소 노드의 텍스트 값을 확인하거나 변경하고자 할 때는 요소 노드에 포함된 텍스트 노드에 접근해야 한다. 텍스트 노드의 값 변경 nodeValue 프로퍼티를 사용하여 텍스트 노드의 값을 변경할 수 있다. var para = document.getElementById("text"); // 아이디가 "text"인 요소를 선택함. function changeText..
[JavaScript] 노드의 관리
·
Language/JavaScript
노드의 추가 다음 메소드를 사용하면 특정 위치에 새로운 노드를 추가할 수 있다. appendChild() insertBefore() insertData() appendChild() 메소드 appendChild() 메소드는 새로운 노드를 해당 노드의 자식 노드 리스트(child node list)의 맨 마지막에 추가한다. function appendNode() { var parent = document.getElementById("list"); // 아이디가 "list"인 요소를 선택함. var newItem = document.getElementById("item"); // 아이디가 "item"인 요소를 선택함. parent.appendChild(newItem); // 해당 요소의 맨 마지막 자식 노드로..
[JavaScript] 노드 리스트(node list)
·
Language/JavaScript
노드 리스트(node list) 노드 리스트는 getElementsByTagName() 메소드나 childNodes 프로퍼티의 값으로 반환되는 객체다. 이 객체는 HTML 문서와 같은 순서로 문서 내의 모든 노드를 리스트 형태로 저장하고 있다. 리스트의 각 노드는 0부터 시작하는 인덱스를 이용하여 접근할 수 있다. // 아이디가 "list"인 요소의 모든 자식 노드들을 선택함. var listItems = document.getElementById("list").childNodes; // 자식 노드들 중 첫 번째 li 요소의 내용을 변경함. listItems[1].firstChild.nodeValue = "HTML 요소의 내용을 변경했어요!"; 위의 예제에서 자식 노드 중 첫 번째 요소를 선택할 때 인덱..