JavaScript

ALL

자바스크립트 HTML 표시내용 변경 innerHTML 사용 방법

자바스크립트로 무언가 처리를 하고 그 결과에 따라 화면상에 문자열을 변경하고 싶은 경우가 있습니다. 이런 경우에는innerHTML프로퍼티를 사용해 표시하고 싶은 내용으로 변경할 수 있습니다. innerHTML프로퍼티를 사용해 표시내용을 변경하는 방법을 알아보겠습니다. innerHTML 우선innerHTML이 무엇인지 살펴보겠습니다. innerHTML은 HTML요소의 내용을 ㄹ변경하고 싶은 경우에 사용하는Element오브젝트의 프로퍼티입니다. 예를 들어div요소나span요소에 작성한 동적으로 내용을 변경할 때 사용할 수 있습니다. i...
ALL

자바스크립트 LocalStorage 사용 방법과 쿠기와 차이점

자바스크립트를 사용하면서 값을 저장해야 하는 경우 변수를 사용합니다. 화면 이동이 있거나 영구적으로 저장해야 하는 경우 DB에 저장을 하거나 임시적으로 저장하고 싶은 경우 쿠키(cookie)를 사용하기도 합니다. 이처럼 일정 시간 또는 영구적으로 값을 저장하고 싶은 경우에 사용할 수 있는 것이 WebStorage API인 로컬 스토리지(LocalStorage)가 있습니다. LocalStorage란? ・데이터를 사용자 로컬에 보존하는 방식. ・데이터를 저장, 덮어쓰기, 삭제 등 조작 가능. ・자바스크립트(JavaScript)로 조작....
ALL

자바스크립트 오브젝트와 null 설명 예제

JavaScript에서는 문자열, 숫자, 논리값이 기본이 되는 데이터형이지만 그 외에도 오브젝트로 불리는 데이터형이 존재합니다. 오브젝트형은 기본 데이터형처럼 단독 값이 아닌, 여러 값을 가지고 있거나 조합해 둔 것으로 생각하면 됩니다. 오브젝트와 null 오브젝트형에는 여러 종류가 있습니다. 예를 들어 여러 값을 모아 이름을 붙인 것을 오브젝트라고 부르고, 여러 값을 모아 번호를 부여한 것을 배열이라고 부릅니다. 오브젝트에 관해서는 별도의 페이지에서 좀 더 자세하게 확인하겠습니다. 여기에서는 데이터형의 하나로써 오브젝트라는 것이 ...
ALL

자바스크립트 논리값 true false 사용 방법 예제

논리값은 기본 데이터형의 하나로 true 또는 false 중 하나의 값을 취득합니다. true와 false는 JavaScript에서 예약어로써 사용되고 있습니다. 스크립트 안에서 논리값을 작성하는 경우true또는false를 직접 작성해야 합니다. 논리값 true false 논리값은 주로 비교 연산자에 포함해 식을 판단한 결과값으로 많이 사용됩니다. 예를 들어 어떠한 값과 어떠한 값이 같은가 다른가 비교할 경우 같다면 true 다르다면 false가 반환됩니다. 다음 예를 보겠습니다. 10 == 10 // true 반환 15 < 6 /...
ALL

자바스크립트 부동소수점 사용 방법 예제

부동소수점 부동소수점으로 작성된 값을 부동소수점 리터럴이라고 부릅니다. 이번에는 부동소수점 리터럴을 스크립트 안에서 작성하는 방법을 확인해 보겠습니다. 소수점 형식의 경우는 정수 부분과 소수점 부분을 마침표를 사용해 구분해서 작성합니다. 3.14 0.0014 그리고 지수 형식의 경우에는 기수가 10으로써 다음과 같이 작성할 수 있습니다. 3.2e2 2.4e-3 은 으로 입니다. 그리고 은 으로 입니다. 그리고 대신에 를 사용해도 괜찮습니다. 3.2E2 2.4E-3 샘플 코드 sample5_1.html <!DOCTYPE html PU...
ALL

자바스크립트 숫자 리터럴 사용 방법 예제

숫자 리터럴 작성 정수로 작성한 값을 정수 리터럴이라고 부릅니다. 이번에는 정수 리터럴을 스크립트 안에서 작성하는 방법을 확인해 보겠습니다. 그리고 전 페이지에서도 작성하였지만 JavaScript에서는 모든 숫자는 부동소수점입니다. 10진수로 정수를 표현하면 다음과 같이 작성할 수 있습니다. 1000 82 그리고 10진수만이 아닌 16진수로 작성할 수도 있습니다. 16진수로 숫자를 표현하기 위해서는 '0x' 또는 '0X'로 시작하는 0부터 9까지 숫자나 A부터 F까지의 기호(소문자 a부터 f까지도 가능)로 숫자를 작성합니다. 0x3...
ALL

자바스크립트 숫자 타입 데이터 작성 방법 예제

숫자도 JavaScript의 기본 데이터형의 하나로 숫자나 숫자에 관한 기호와 조합해 작성합니다. 예를 들어 17이나 3.141 등의 숫자입니다. 숫자는 계산을 하거나 반복 처리를 하는 경우에 회수를 카운터 하는 등의 용도로 이용됩니다. 스크립트 안에서 작성된 숫자는 숫자 리터럴이라고 불리기도 합니다. 숫자 숫자 작성은 다음과 같이합니다. 100 3.141 문자열처럼 이나 등으로 감싸줄 필요가 없습니다. 반대로 숫자에 등으로 감싸는 경우는 숫자가 아닌 숫자를 의미하는 문자 또는 문자열이 됩니다. 174 // 숫자 "174" // 문...
ALL

자바스크립트 특수 문자 입력 방법 예제

특정 문자 입력(이스케이프 시퀀스) 문자를 문자열을 값으로 사용하는 경우 키보드로 입력 불가능한 문자가 있습니다. 예를 들면 개행문자가 있습니다. 문자열에서 개행을 키보드로 입력하면 다음과 같이 됩니다. alert("안녕하세요 잘 지내세요?"); 위의 예에서는 와 의 사이에 개행을 입력하려고 하였지만 키보드에서 키를 누르면 코드의 개행만이 됩니다. 전 페이지에서 다루었던 내용에 JavaScript에서 문자열 도중에는 개행을 할 수 없다고 했었습니다. 그래서 개행등 키보드로 입력 불가능한 문자 등은 + 특정 문자의 조합으로 표현합니다...
ALL

자바스크립트 문자열 작성 방법 예제

JavaScript 데이터형 JavaScript에서 사용 가능한 문자열이나 숫자 등의 데이터형에 대해 확인해 보겠습니다. JavaScript에서 다루는 값은 어디엔가의 데이터형에는 속해 있습니다. 문자열 문자열은 JavaScript의 기본 데이터형의 하나이며 알파벳이나 숫자 등의 문자를 조합한 것입니다. 예를 들어 나 등이 문자열이 됩니다. 주로 무언가 메세지나 HTML 문장 등을 브라우저나 다이얼로그에 표시할 때에 사용합니다. 문자열을 스크립트 안에서 작성하는 경우에는 문자열 리터럴이라고 부르는 경우도 있습니다. 스크립트 안에서 ...