본문 바로가기
반응형

전체 글256

조건문 (feat. 조건문을 이용한 주간모드,야간모드 전환 버튼 생성) 조건문이란, 주어진 조건에 따라서 애플리케이션을 다르게 동작하도록 하는것이다. 조건문은 if로 시작하며, if 뒤의 괄호 안에 조건을 기입한다. (조건이 될 수 있는 값은 Boolean이다.) IF 뒤의 괄호 안에 조건이 true 이면, IF문 뒤의 중괄호 { } 구간이 실행되고, IF 뒤의 괄호 안에 조건이 false 이면 else문 뒤의 중괄호 { } 구간을 실행한다. 이 조건문을 이용하여 이전 "제어할 태그 선택하기" 강의에서 학습하였던 주간모드/야간모드 버튼을 하나로 통합하여 생성해보자. https://nossodia.tistory.com/117 제어할 태그 선택하기 (야간모드,주간모드 버튼 생성) https://www.w3schools.com/js/tryit.asp?filename=tryjs_d.. 2021. 9. 8.
비교연산자와 블리언 비교연산자는 좌항과 우항의 값을 비교하여 True나 False를 출력한다. 비교연산자에는 ===와 >이 있다. === 은 동등비교 연산자라고 하며, 좌항과 우항을 비교하여 같은값이면 True, 다른 값이면 False를 출력하는 연산자이다. html에 1===1, 1===2를 입력하면 입력한 그대로의 문자를 출력하지만, 자바스크립트에서 비교연산자를 기입하면 두값을 비교하여 True나 False를 출력한다. (Ex. 1===1 -> 1과 1은 같은값이므로 True, 1===2 -> 1과 2는 다른 값이므로 False를 출력.) 다음은 비교연산자 중 둘의 크기값을 비교하는 부등호를 살펴봅시다. 부등호에 대한 예시를 살펴보기에 앞서 미리 html의 문법 한가지를 참고하기 바랍니다. 보통 부등호는 로 표현하죠. .. 2021. 9. 8.
제어할 태그 선택하기 (야간모드,주간모드 버튼 생성) https://www.w3schools.com/js/tryit.asp?filename=tryjs_default Tryit Editor v3.7 Click the button to change the layout of this paragraph Click Me! function myFunction() { let x = document.getElementById("demo"); x.style.fontSize = "25px"; x.style.color = "red"; } www.w3schools.com 자바스크립트 공부 중 별도로 앱 구동하지 않고도 사이트 내에서 자바스크립트를 작성하고 바로 결과를 확인할 수 있다. 오늘의 학습목표 : 주간모드와 야간모드 전환 Night 버튼 클릭 시 야간모드 실행 : 배경은.. 2021. 9. 8.
CSS 기초 : 선택자 CSS 선택자 관련 상세 내용은 부스트코스 포스팅 참고할 것. https://nossodia.tistory.com/31?category=802521 CSS_ 선택자(selector) 1. 요소 선택자 선택자 중에 가장 기본이 되는 선택지이며, 태그 선택자라고도 합니다. 요소 선택자는 선택자부분에 태그 이름이 들어갑니다. 문서 내에 선택자에 해당하는 모든 요소에 스타일 nossodia.tistory.com https://nossodia.tistory.com/32?category=802521 CSS_문서 구조 관련 선택자 선택자 중에는 문서의 구조를 이용하여 요소를 선택하는 선택자도 있습니다. 문맥이나 요소의 구조를 기반으로 하여 선택자를 조합하는 것을 "조합자" 또는 "결정자" 라고 부릅니다. 이 조합자 .. 2021. 9. 8.
변수와 대입 연산자 콘솔에서 x와 y라는 변수를 생성하여 예를 들어보자. 예를 들어 콘솔에서 x=1, y=2을 입력했을 때 x+y를 실행하면 결과는 3이 된다. 그리고 다시 x=1000이라고 입력했을 때 x+y는 1002가 된다. 여기서 x, y를 변수(Variable)라고 하고 '='은 대입연산자 라고부른다. 그렇다면 '1=2;'를 대입하면 어떻게 될까? 숫자 1과 2는 변하지 않는 값, 상수(Constant)이기 때문에 오류가 발생된다. 변수는 왜 이용하는가? 예를들어 아래와 같은 내용의 alert창을 만들었다고 가정해보자. "Ester"이라는 이름이 중복해서 등장하도록 프로그래밍을 하였는데 이 Ester이라는 값이 수시로 변경되는 값이라면 어떻게될까? 변경될때마다 기존 "Ester"의 위치를 찾고 값을 수정해주어야한다.. 2021. 9. 6.
데이터타입-문자열과 숫자 https://developer.mozilla.org/ko/docs/Web/JavaScript/Data_structures 자바스크립트의 자료형 - JavaScript | MDN 모든 프로그래밍 언어는 내장 자료형이 있지만, 종종 이러한 내장 자료형은 언어마다 다르다. 이 문서에서는 자바스크립트의 내장 자료형과, 내장 자료형에서 사용할 수 있는 속성들에 대해 알 developer.mozilla.org 자바스크립트에는 6가지데이터 유형(Undefined, Boolean, Number, string, BigInt, Symbol)이 있다. 이 중 Number와 String에 대해 알아보자. - 웹페이지에서 마우스 우클릭 [검사]-[console] 탭에서 확인. 숫자(Number) 숫자(Number) 데이터의 .. 2021. 9. 5.
반응형