JavaScript Node Method
JavaScript Node Method ■ 지난 글에서는 노드에 접근하는 방법 중에서 name 속성을 이용해서 순차적으로 접근하는 방법에 대해서 알아봤는데요. 이번에는 메서드를 이용해서 바로 접근하는 방법과 노드를 생성하는 메서드를 알아보겠습니다. ■ 메서드로 접근하는 방법에는 세 가지가 있는데요. '이름', '아이디', '태그 이름' 등 세 가지 속성값을 이용해서 접근할 수 있구요. 메서드의 형식은 다음과 같습니다. var aaa = getElementsByName(이름); var bbb = getElementsById(아이디); var ccc = getElementsByTagName(태그이름); 다음과 같은 문서가 있을 때 메서드를 이용해서 이 텍스트 박스에 접근하는 형식은 다음과 같습니다. 1. ..
javascript location 객체의 속성과 메서드
javascript location 객체의 속성과 메서드 ■ 자바스크립트 객체 중에서 location 객체는 현재 사용 중인 URL에 대한 정보를 읽어오거나 제어를 하는 역할을 하는데요. location 객체의 속성과 메서드에 대해서 정리해보고, 간단한 예제도 만들어 보겠습니다. location 객체의 속성은 다음과 같습니다. 1. hash: URL의 정보 부분 2. search: URL의 쿼리 부분 3. host: 호스트 이름과 폰트 번호 4. href: URL의 이동 5. pathname: URL에 포함된 경로 문자열 6. origin: 프로토콜, 호스트 이름, 폰트 번호 7. protocol: 프로토콜(웹에서 사용하는 통신 형식) 8. port: 포트 번호 9. hostname: URL에 포함된 호..
javascript history 객체
javascript history 객체 ■ 자바스크립트의 history 객체는 사용자가 방문했던 URL을 관리하는 역할을 하는데요. 이 녀석을 이용해서 방문했던 웹 페이지의 제어가 가능합니다. 이 객체의 속성과 메서드도 몇 개 안되니까 간단하게 알아볼게요. 먼저 속성에서는 history에 저장되어 있는 URL의 숫자만 확인할 수 있는 length 속성이 있구요. 메서드는 세 개가 있는데 1. go() : history 객체에 저장되어 있는 페이지 중에서 특정 페이지로 이동 2. back() : 이전 페이지로 이동 3. forward() : 다음 페이지로 이동 ■ 웹 페이지의 상단 툴바에 보이는 '←(뒤로)', '→(다음)' 버튼의 역할과 같다고 생각하시면 되겠죠? 이 메서드는 보통 웹 페이지에 로그인할 ..
자바스크립트 대화상자 JavaScript alert prompt
자바스크립트 대화상자 JavaScript alert prompt ■ 자바스크립트의 내부 함수 중에서 alert()와 prompt() 함수에 대해서 알아볼 텐데요. prompt 함수는 사용자가 어떤 데이터값을 입력할 수 있도록 다이얼로그를 띄어주는 함수이구요. alert 함수는 사용자에게 메시지를 보여주는 역할을 하는 함수 입니다. 이것들의 형식을 알아보고, 예제를 만들어 볼게요. ▣ prompt()의 형식 prompt(다이얼로그에 표시할 메시지, 기본값); 형식대로 HTML 문서에 넣어보겠습니다. ■ 다이얼로그에 표시할 메시지는 "이름을 입력하세요."라고 했구요. 기본값은 "홍길동"으로 설정하고 브라우저에서 실행하겠습니다. ■ 이렇게 다이얼로그가 뜨고, 메시지와 기본값이 출력되고 있습니다. prompt가..
자바스크립트 javaScript while문
자바스크립트 JavaScript while문 ■ 자바 스크립트에서 가장 많이 사용하는 반복문은 for문 이겠지만, 경우에 따라서는 while문을 이용하기도 하는데요. while문은 횟수가 정해지지 않은 반복문에서 주로 사용됩니다. while문은 어느 조건만 만족하면 계속해서 실행되기 때문에 그 안에는 반드시 반복문을 빠져나오는 조건을 넣어줘야 합니다. 그렇지 않으면 무한루프를 돌게 돼서 컴퓨터를 재부팅 해야 하는 문제가 생길 수도 있어요. 어떤 내용인지 하나씩 알아보겠습니다. ■ 먼저 while문의 형식은 다음과 같습니다 . while(조건){반복되는 내용while문을 탈출하는 조건} 이해를 돕기 위해서 다음과 예제를 만들어보겠습니다. ▲ while문의 조건에 (true)를 입력했기 때문에 이 조건문은 ..
HTML CSS JavaScript 자바스크립트 연결
HTML CSS JavaScript 자바스크립트 연결 ■ 우리가 눈으로 보는 웹 브라우저 화면은 [HTML + CSS + 자바스크립트]로 만들어져 있는데요. 이들 문서를 모두 한 곳(HTML)에 작성해도 되지만, 많이 복잡해지기 때문에 이번 글에서는 각각의 문서를 분리해서 작성하고 연결하는 방법을 알아보겠습니다. ■ HTML은 화면의 전체적인 구조를 잡아주는 역할을 하고 확장자는 [.html]입니다. css는 화면을 이루고 있는 각 요소의 위치와 모양 등을 꾸며주는 역할을 하고 확장자는 [.css]입니다. 앞에 두 문서의 역할이 전체적이 화면을 이루고 꾸미는 것들이라면 자바스크립트는 이것들을 역동적으로 움직여주는 역할을 하구요. 확장자는 [.js]입니다. 대충 개념을 알아봤으니 세 개의 문서를 작성하겠습..