자바스크립트에는 Date라고 하는 날짜 객체가 존재한다. Date 원하는 시간대를 날짜 형식에 맞춰 데이터로 돌려준다. 안에 날짜 함수 counterMaker 추가 후 버튼과 연결 버튼을 누를 때마다 누른 시간이 출력된다. 현재시각 뿐만 아니라, 특정 시각도 받을 수 있다. new Date('yyyy-mm-dd') → 소괄호 안에 날짜 형식을 맞춰서 문자열로 특정값을 넣어준다. 목표시간까지 남은 시간도 구할 수 있다 목표시간 - 현재 시간 목표시간까지 도달할 때까지의 초(0.0001초까지) 온전한 초로 사용하려면 나누기를 통해서 0초 이하의 시간대는 소수점 이하로 수를 내려줘야 한다. 남은 시간 구하기 : 초 / 3600 남은 일수 구하기 : (초 / 3600) / 24 크리스마스까지 33일 남았다는 것..

태그에 대해 알아보자. 우선, 코드 정리를 했다. 태그 텍스트를 입력받는 공간 그 공간에 어떤 텍스트가 입력되었는지 js에게 알려주기 위해서는 먼저 공간의 데이터를 소유하고 있어야 한다. 해당 데이터를 참조하고 소유하는 방법 console.log(document) 라고 입력하자 현재 내가 작성 중인 html의 내용이 출력됐다. document란 객체의 일종으로, 에 입력되어 있는 값을 데이터로 가져올 수 있다. querySelector() 태그들을 그대로 본인이 있는 영역으로 가져올 수 있다. () 안에 해당 태그를 적으면 되는데 태그가 여러 개 있을 경우 id 또는 class로 적어서 특정한다. id가 들어갈 경우 : #아이디명 class가 들어갈 경우 : .클래스명 버튼을 누르면 태그 자체가 가져와버..

onClick 태그에 속해있는 속성 버튼이 클릭되었을 때 안쪽 코드가 실행된다. 버튼을 누르면 console.log가 실행된다. 지난 게시물에서 만든 output 함수와 연결해보자. 함수 실행시키기 → 함수명() 버튼을 누를 때마다 output 함수가 실행된다

consoleTool이라는 함수를 선언해보자. 함수를 사용하라면 '호출'이 필요하다. → 함수명() vscode에서도 태그에 함수를 추가해주면 사용할 수 있다.

HTML 웹페이지를 구성하는 가장 기본적인 마크업 언어 HyperText Markup Language 태그들의 조합으로 구성된 문서 헤드태그 우리가 페이지를 구성할 때 필요한 정보들 페이지의 이 바디태그 실제로 보여지는 페이지의 내용 한 줄 전체를 차지한다. 한 줄 전체가 아닌 본인이 가진 컨텐츠만큼의 영역을 차지한다. 자동으로 줄이 바뀌지 않는다 텍스트를 입력하는 공간을 만들어준다 열림과 닫힘이 한 태그에서 일어난다 버튼 모양을 만들어준다 속성 태그는 중복적으로 사용이 가능하기 때문에 id와 class 속성로 태그를 특정할 수 있다. id 속성은 중복될 수 없다. 하나의 값으로 여러개의 태그를 묶어주고 싶다면 class 속성을 활용한다. 공백x style 태그 영역에 css 속성 적용 세미콜론(;) 끝..

객체(Object) 데이터를 배열과 같이 묶음으로 관리하지만 순서가 아니라 하나의 데이터의 각 카테고리별로 데이터를 관리해주는데이터 타입 여러 개의 property를 갖는 데이터 타입 각 property들은 key와 value로 이루어진다(콜론:으로 구분) 객체의 데이터에 접근하는 방법 1. Dot notation 객체명.접근하고 싶은 프로퍼티의 키 → 해당 키에 해당하는 value를 얻을 수 있다 객체의 property 중 아직 존재하지 않는 키를 추가할 수도 있다. (객체명.추가하고 싶은 속성의 키 = 할당할 value) 2. Bracket notation 데이터에 접근할 객체["접근하고 싶은 property의 키"] → 키와 쌍을 이루는 value를 얻을 수 있다. ※만약 [] 안에 ""를 사용하지..