TIL/Javascript18 /JavaScript/조건문 형식 조건문 boolean과 비교 연산자를 통해 상황에 알맞은 코드를 실행할 수 있게 한다. 형식 저번 학습에서 배웠던 boolean과 비교 연산자를 응용하는 방법을 알아봤다. 간단한 예제를 통해 알아보자! 위와 같이 코드를 작성하게 되면 웹페이지에서는 숫자 옆의 태그에 따라 줄 바꿈 되어 순서대로 세로로 나열될 것이다. if문(조건식) 여기서 저 나열된 숫자들을 어떠한 조건에 맞춰졌을 때 출력이 안되게 만들어 보았다. 그때 사용되는 게 if문과 boolean을 사용하는 것이다. 위처럼 작성하게 되면 웹페이지에서는 다음과 같은 결과를 출력해준다. if문의 ( ) 안에 true라는 boolean 값에 의해 위와 같은 결과가 나온 것이다. 그럼 ( ) 안에 false값이 들어갔을 때 어떤 결과가 나올까. 이처럼 .. 2021. 12. 23. /JavaScript/비교 연산자,boolean 비교 연산자 지금 사용 중인 플랫폼 Atom에서의 비교 연산자는 , === 를 사용한다. 비교 연산자를 통해 연산자 기준으로 좌항 값과 우항 값을 비교하여 'true', 'false'를 출력해준다. Boolean 비교 연산자에서 나온 결괏값 'true', 'false'를 boolean이라 한다. boolean을 이용하여 조건문을 사용하게 되면 단순 반복 작업에서 벗어날 수 있는 매우 유용한 데이터이다. 예제를 통해 비교 연산자의 사용과 결과를 확인해보자! 먼저 위와 같이 작성했다 하자. 예제와 같이 입력되었을 경우 웹페이지에서는 script태그를 만나 JavaScript언어를 인지 할 것이다. script 태그에 들어가 있는 document.write();의 () 안에 값을 계산하여 웹페이지에 출력해 준.. 2021. 12. 22. /JavaScript/태그 제어 동적으로 활용 JavaScript를 이용하여 HTML을 동적으로 사용해 보자. 저번에 배웠던 event에서 버튼을 만들어 활성화시키는 것을 배웠다. 그 버튼을 활성화시켜 동적으로 사용할 수 있게 해 보았다. 먼저 태그 안에서 JavaScript를 통해 버튼을 활성화시켜보자. 위와 같은 예제로 버튼 1번과 버튼 2번이 웹브라우저에 만들어지게 된다. 여기서 버튼 1번을 누르면 웹브라우저에 바탕색과 또는 나타나 있는 텍스트의 색상이 변하도록 해보았다. 그럼 먼저 웹브라우저에서 인식을 하도록 하기 위해 저번 시간에 배웠던 CSS의 선택자를 이용해보았다. 예제의 방법으로 document.queryselector('body')를 적용하게 되면 파일 내에 body라는 태그를 선택한 것으로 인식하게 만들어준 뒤. sy.. 2021. 12. 21. /JavaScript/CSS활용 CSS란 Cascading Style Sheet의 약자이며 HTML언어가 웹브라우저에서 표현되는 스타일 언어이다. 즉 디자인 요소를 담고 꾸며주는 역할이다. 사용방법 CSS언어를 사용하는 방법은 원하는 태그 안에 style 속성을 적용하고 속성 값으로는 CSS언어를 사용하여 꾸며준다. style속성 값으로는 CSS언어가 들어오도록 약속되어 있다. style="color:green">JavaScript 이렇게 적용하게 되면 태그 안에 있는 텍스트는 color라는 CSS의 속성 값으로 인해 글 색상이 초록색으로 변하게 된다. 하지만 아무런 태그가 붙지 않는 텍스트에 적용하려면 어떤 방법이 있을까? JavaScript JavaScript 이처럼 와 이라는 태그를 사용할 수 있다. 와 태그는 아무런 기능도 의미.. 2021. 12. 20. 이전 1 2 3 4 5 다음