✅ 간단 정리 const id = document.getElementById(id) : id와 일치하는 요소 가져옴 id.addEventListener("이벤트명", (event) => { // 실행문장 }); ✅ focus, blur : 포커스에 있을 때, 없을 때 See the Pen Untitled by Emily (@MsEmily1020) on CodePen. 텍스트창에 포커스가 있을 경우 -> 텍스트창을 클릭하면 됩니다. 빨간 배경으로 표시되며 다른 곳으로 포커스가 있을 경우 -> 다른 빈 곳을 클릭하면 됩니다. 다시 하양색 배경으로 돌아가게 됩니다. ✅ change : input창에 입력 후 다른 곳을 클릭한 다음, 다시 input 창을 클릭 시 이벤트 발생 1) input에 쓴 글자의 길이가..
✅ 간단 정리 const id = document.getElementById(id) : id와 일치하는 요소 가져옴 id.addEventListener("이벤트명", (event) => { // 실행문장 }); event.key : key의 코드를 가져옴 ✅ keydown / keyup : 누르고 있을 때, 떼었을 때 See the Pen Untitled by Emily (@MsEmily1020) on CodePen. keypress도 있지만 사용하지 말라고 권고하고 있으니 따로 사용하지는 않겠습니다. 입력창에 커서를 올린 후 Enter를 누르고 있으면 글씨가 빨간색이 되고 떼면 검은색으로 변합니다.
✅ 간단 정리 const id = document.getElementById(id) : id와 일치하는 요소 가져옴 id.addEventListener("이벤트명", (event) => { // 실행문장 }); ✅ click : 마우스 클릭했을 때 글씨가 검정색일 때 클릭하면 빨강색이 되고 글씨가 빨강색일 때 클릭하면 검정색이 된다. See the Pen Untitled by Emily (@MsEmily1020) on CodePen. ✅ dblclick : 더블 클릭했을 때 글씨가 검정색일 때 더블 클릭하면 빨강색이 되고 글씨가 빨강색일 때 더블 클릭하면 검정색이 된다. See the Pen Untitled by Emily (@MsEmily1020) on CodePen. ✅ mousedown / mous..
저번 시간에는 기초적으로 함수의 기본적인 틀을 배웠다면 지금은 함수를 좀 더 깊게 들어가 여러가지 함수에 대해 배우고자 합니다. 함수는 단순히 function 함수명 () {} 구조가 아닌 여러 방식으로 쓰입니다. 그 중에서 익명 함수, 즉시 실행 함수, 화살표 함수에 대해 배우고자 합니다. 💡 익명 함수(Anonymous Function)이란? 이름에서도 알 수 있듯이 이름이 없는 함수입니다. 감을 더 잡기 위해 기본 적인 틀을 봅시다. 먼저 이름이 없다고 했으니 단순히 이름 없이 함수를 정의해볼까요? function (매개변수1, 매개변수2) { // 실행문장 } 기본적으로 함수는 function 키워드 다음에 함수명이 오지만 익명 함수는 그렇지 않습니다. 그렇다면 함수를 호출할 때는 어떻게 해야할까..
💡 함수(Function)란? 어떤 작업을 수행하기 위해 필요한 실행 문장들을 집합하여 정의한 코드 블록입니다. 함수의 장점은 프로그램에서 특정 작업을 여러 번 반복해야 할 때, 해당 작업을 수행하는 함수 하나만 만들게 되면 기능을 또 구현하지 않아도 함수를 호출하기만 하면 똑같은 기능을 사용할 수 있습니다. 또한, 함수는 여러 번 호출할 수 있기 때문에 코드를 재사용할 수 있습니다. ✅ 함수(Function)의 정의 자바스크립트에서 함수는 function 키워드로 시작하여 함수이름 () { } 구조로 선언합니다. // 함수 선언 function 함수이름(매개변수1, 매개변수2) { // 실행문장 } 함수이름(인수1, 인수2); // 함수 호출 1) 함수이름 : 함수 이름만 보고도 어떤 기능을 하는지 힌..