메모장

if문을 사용하여 태그를 작성해봅시다.  즉 , if문의 뒤에 따라오는 괄호 안에는 불리언 데이터 타입 (true 와 false) 이 오는데 , true 면 첫번째 중괄호 안의 코드가 실행되고 , 두번째 중괄호 안의 코드는 무시됩니다. 반면 false라면 첫 번째 중괄호 코드는 무시되고, else 안에 있는 코드가 실행 된다는 것이 조건문을 이해하는데 가장 중요한 요소입니다. 이제 우리가 해야할 것은 if 뒤에 오는 괄호 안에 들어갈 불리언 값을 조건에 따라 true 또는 false가 들어오게 하는것입니다.

자바스크립트의 여러 기능 중에서 비교 연산자라는 것과 비교 연산자를 통해 만들어지는 불리언 이라는 새로운 데이터 타입 그리고 조건문이라는 주제를 연달아 함께 살펴 보겠습니다.  === 가 무엇인지document.write(1===1); 이라는 코드를 넣으면 === 연산자는 왼쪽에 있는 값과 오른쪽에 있는 값이 같은지 판단합니다. 그래서 두 값이 같아서 참 (true) 라고 출력됩니다.   1===2 는 같지 않기때문에 false 가 나옵니다. 여기서 알 수 있는 점은 === 는 비교 연산자 이면서 이항연산자 라는 뜻 입니다. 이항 연산자를 사용 할 때는 좌항과 우항이 있고, 좌항과 우항을 결합해서 어떠한 데이터를 만듭니다.  이번에는 1'less than' 이라는 뜻에서 < 라고 씁니다.  이렇게 ..

조건문 이라고 하는 것은 하나의 프로그램이 하나의 흐름으로 가는 것이 아니라 조건에 따라 다른 순서의 기능들이 실행되게 하는 것 이라고 할 수 있습니다. 야간모드에서 버튼을 클릭하면 주간모드가 되고, 주간모드에서 버튼을 클릭하면 야간모드가 되는 기능을 구현하고 싶다. ---> 이것을 토글 (toggle)이라고 한다.  즉 if 라는 조건문에 따라 현재 모드가 주간모드라면 if 의 코드가 실행되고, 주간모드가 아니라면 else의 코드가 실행됩니다. 조건문과 함께 === 라는 비교 연산자도 살펴 볼 텐데, 이 비교 연산자를 통해 만들어진 불리언(boolean) 이라는 것도 살펴볼 예정입니다.

HTML과 자바스크립트는 둘 다 컴퓨터 언어입니다. 하지만 자바스크립트는 컴퓨터 언어 또는 컴퓨터 프로그래밍 언어라고 하지만 HTML은 컴퓨터 프로그래밍 언어라고 하지 않습니다. '프로그램' 이란 예를들면 시간의 흐름에 따라 음악이 연주되는 순서가 있는데 단어의 중심에는 순서라는 의미가 깊숙이 자리잡고 있습니다. 컴퓨터에는 여러가지 기능이 있습니다. 우리가 컴퓨터로 어떤 일을 하려고 할때 그 기능 중 하나만 필요한 경우는 거의 없습니다. 어떤 의도에 따라 순서대로 여러 기능을 작동 시키는것이 우리가 컴퓨터를 사용하는 일반적인 방법입니다. 그래서 사람들은 컴퓨터 프로그래밍 언어라는 것을 만들었습니다. 시간 순서에 따라 실행돼야 할 기능을 프로그래밍 언어의 문법에 맞게 글로 적어두는 방식을 고안한 것 ..

예를 들어 웹페이지의 버튼을 누르면 night 모드가 되고 , 버튼을 누르면 day 모드가 되는 것을 만들어보려고 한다. 그리고 이 버튼을 클릭했을때의 이벤트가 필요합니다. 그래서 onclick 속성을 추가하고, onclick안에 내용을 넣어볼 예정 이다.  이 버튼을 클릭했을때 태그에 style 속성을 동적으로 , 프로그래밍적으로 , 상호작용에 의해 넣으려고 할때 자바 스크립트 문법에 따라 웹 브라우저에게 태그를 선택하게 해야 한다.  document.querySelector(selectors);  버튼에 한번 적용 해보겠습니다.  사용자와 상호작용 해서 HT..

css를 이용해 웹페이지에 있는 여러 요소를 제어하려 할 때 사용하는 선택자를 살펴보자 선택자를 이용해야 웹페이지를 구성하는 여러 요소에 효과를 효율적으로 줄 수 있기 때문이다. id 라고 지정된 값에는 적용에서 #을 붙여야 합니다. .은 클래스를 의미하고 #은 id 를 의미하기로 약속돼 있습니다.  ... 생략 ...#first{ color: green;} JavaScript 클래스(class) 는 무언가를 그루핑 한다는 것 ( 반 )아이디(id)는 어느 한가지 대상을 식별 한다는 것 ( 학번 ) id 선택자가 가장 우선순위가 높기 때문에 id 선택자의 기준으로 수행된다. css 에서 가장 중요한 문법 중 하나가..

선택자 라는 것이 있습니다. ' JavaScript '를 css로 꾸며주고 싶은데, 꾸며주려고 하니 감쌀 수 있는 어떠한 기능이나 의미가 없는 태그가 필요하다는 사실을 알 수 있습니다. 그래서 태그로 감싸 보겠습니다. 라는 태그는 어떠한 의미나 기능도 없습니다. css를 통해서 또는 자바스크립트를 통해서 어떤 정보를 제어하고 싶을때 감싸주는 역할을 하는 무색무취의 태그 입니다. 줄바꿈 되지 않는 무색무취의 태그는 이라는 태그 입니다. 우리는 만약 폰트에 밑줄도 치고싶고 , 글자크기를 키우고 싶다면 1억개를 수정해야 하는데 쉬울까요 ? 어렵습니다. 이 웹페이지에 태그를 만들고, 태그를 만듭니다. 태그는 마치 태그처럼 웹 브라우저에게 태그로 감싼 코드가 css 코드 라는 것을 ..

JavaScript란 무엇인가? 라는 문장이 있는데 이것을 디자인적으로 바꾸고 싶은 욕심이 생겼다면 바꾸고 싶은 태그에 style 속성을 쓰면 됩니다.JavaScript란 무엇인가? ' color: powderblue ' 가 바로 css라는 html과 자바스크립트와는 완전히 다른 컴퓨터 언어의 코드 입니다. 그리고 style은 HTML의 문법 입니다. 이 코드는 css 문법 중에서 속성 (property) 이라고 합니다. 만약 ' JavaScript란 무엇인가? ' 라는 텍스트에 배경색을 주고 싶다면 어떻게 해야 할까요 ?JavaScript란 무엇인가?style 이라는 속성에 css 코드를 넣으면 디자인 할 수 있다는것과 속성이라는 문법의 구조를 파악하고 있다면 검색을 통해 해결할 준비가 ..

자바스크립트를 통해 할 수 있는 일 가운데 하나인 웹 브라우저를 제어 하는 방법에 대한 구체적인 기술을 살펴 보겠습니다. 웹페이지에서 night 버튼을 눌렀을때 배경색을 검은색으로 바꾸고, 글씨색은 흰색으로 바꾸고 싶습니다.  이것은 즉 , night버튼을 클릭 했을때 이 웹페이지에 있는 태그의 스타일 속성을 바꿀수 있다면 우리가 하고자 하는 일을 할 수 있습니다. 즉 , HTML은 한번 화면에 표시되면 자신을 바꿀 수 없는 능력을 가진 정적인 언어입니다. 하지만 자바 스크립트를 이용하면 어떻게 될까요 ? 이를 위해 필요한 지적인 부품들이 있는데 첫번째 , style 에 들어가는 css에 대해 약간 알 필요가 있다. 두번째 , 스타일 속성을 주기위해 그 속성을 가지고 있는 태그를 ..

변수 라는것은 바뀔수 있는 값 입니다. 여기서 x 라는것을 변수 라고 하고 = 는 대입연산자 라고 한다. 즉, 오른쪽 항에 있는 값을 왼쪽에 있는 변수에 대입하는 역할을 합니다. x 라는것은 대입 연산자를 통해 값이 바뀔수 있다는 뜻에서 변수 입니다. 하지만 숫자 1은 언제나 1 이기 때문에 바뀌지 않는 다는 점에서 상수 라고 합니다.  그렇다면 변수를 왜 써야 할까 ? 우리는 생각을 극단적으로 해볼 수 있다. 'egoing' 이라는 단어가 1억개 있을때 ,그 이름을 'leezche' 로 바꿔야 한다고 생각 해볼때 변수를 안쓰면 모든 곳 마다 하나씩 다 바꿔줘야 한다. 따라서 name 이라는 변수에 'egoing..