yoony0612님의 블로그

[자바스크립트] 이벤트 리스너 달기(콜백함수)

값을 입력하고 버튼을 클릭하는 것 등은 태그에 이벤트를 발생시킨다. 예를 들어, input 태그에는 키보드를 치는 이벤트 또는 값을 입력하는 이벤트를 발생시키고, button 태그는 클릭하는 이벤트를 발생시킨다. 이벤트를 달아주기 위해 태그.addEventListener('해당이벤트', function() {}) 를 사용한다. : '해당 이벤트'가 실행 될...

• 프로그래밍 언어

[자바스크립트] 대화창(prompt, alert, confirm)

const number = parseInt(prompt('몇 명이 참가하나요?'), 10); alert(number); const yesOrNo = confirm('맞나요?'); // boolean true or false prompt : 사용자로부터 값을 전달받는다. 입력되는 것은 문자열이기 때문에 숫자로 인식하려면 숫자로 바꿔줘야 한다. const nu...

• 프로그래밍 언어

[자바스크립트] 배열 push, pop, shift, unshift

그룹으로 묶어질 수 있는 것은 배열이나 객체를 사용하여 묶어준다. 배열 안에 들어있는 메서드로 push, pop, shift, unshift 가 있다. push : 마지막에 추가 pop : 마지막 것 뽑기 shift : 처음 것 뽑기 unshift : 처음에 추가

[자바스크립트] 비동기

이벤트 리스너는 위에서 아래로 실행되는 코드에 대한 예외이다. 처음에 이벤트 리스너의 코드 전부가 실행되는 것이 아닌, 'submit' 부분까지만 실행 된다. 그 뒤의 콜백 함수는 실행은 하지 않고, 컴퓨터가 기억만 하고 있다. 사용자가 submit 하는 순간, 콜백 함수가 실행 된다. 이러한 콜백 함수를 비동기라고 한다. 자바스크립트에서 비동기는 코드 상...

[자바스크립트] 이벤트 리스너 맛보기

입력창에 입력하고, 입력 버튼을 눌렀을 때 자동으로 입력창에 포커스되도록(커서가 깜빡이도록) 만들어준다. -> focus() 를 추가해준다. 버튼 클릭 후, 입력창을 따로 클릭해주지 않아도 포커스되있음을 확인할 수 있다. 입력창에서 엔터를 누르면, 입력 버튼을 누르도록 만들어준다. -> input과 button 태그를 form 태그로 감싸준다. form 태...

[자바스크립트] 끝말잇기 화면에 표시하기

addEventListener 를 사용하여, '입력' 버튼을 클릭할 때마다 수행될 내용을 만들어준다. 클릭될 때마다 반복될 내용을 function 로 선언해준다. 이 function 을 ' 콜백 함수 '라고 한다. 태그 안에 들어가는 글자는 textContent이고, 에 들어가는 글자는 value이다. c언어 등에서 문자와 문자열을 구별해서 사용하지만, 자...

[자바스크립트] JS로 HTML 태그 만들기

자바스크립트에서 document.body 를 하면, html의 body 부분이 선택된다. document.createElement() 메서드를 사용해 html 태그를 만들 수 있다. document.body.append() 를 사용해야, 만들어낸 html 태그를 body에 추가해준다. textContent 로 태그 안에 들어가는 글자를 넣어준다.

[자바스크립트] window 객체

window : 브라우저 전체를 담당한다. window.document : window 객체 안에 들어있는 객체이다. 화면(페이지, 탭)을 담당한다. window는 생략할 수 있다. window는 전역 객체 이기 때문이다. window는 자바스크립트 문법에서 지원하는 것이 아니라, 브라우저가 window 객체를 만들어서 넣어둔 것이다. -> window는 ...