쫑가 과정

목표 해야 할 일을 입력해서 화면에 띄운다. 그리고 삭제 버튼을 눌러서 없앨 수 있다. 작동원리 파악 html에 ul태그를 만들어 놓고 submit 할 때마다 li태그가 생성. li안에 삭제 button 태그와 입력값이 들어갈 span태그를 만들어서 넣자. span에 input에 입력값을 넣고 span을 화면에 띄우고 localStorage에 저장. 삭제 버튼을 누르면 해당 li태그 포함하는 화면과 저장 값 둘 다 지워진다. 저장 값이 있다면 꺼내서 화면에 띄움. ※ 여러 리스트를 추가한다는 것을 잊지 말기. 생성하고 지울 수 있어야 한다. 1. 필요한 태그 만들기. 오늘의 할 일 const toDoForm = document.querySelector(".todo_form"); const toDoInpu..

주어진 함수를 배열 요소 각 각에 대해 실행한다. Array.prototype.forEach() - JavaScript | MDN forEach() 메서드는 주어진 함수를 배열 요소 각각에 대해 실행합니다. developer.mozilla.org 구문 arr.forEach(callback(currentvalue[, index[, array]])[, thisArg]) callback - 각 요소에 대해 실행할 함수. 다음 세 가지 매개변수를 받는다. currentValue - 처리할 현재 요소. index (Optional) - 처리할 현재 요소의 인덱스. array (Optional) - foreach()를 호출한 배열. thisArg (Optional) - callback을 실행할 때 this로 사용할..

함수를 화살표로 표시한다. 화살표 함수 - JavaScript | MDN 화살표 함수 표현(arrow function expression)은 function 표현에 비해 구문이 짧고 자신의 this, arguments, super 또는 new.target을 바인딩 하지 않습니다. 화살표 함수는 항상 익명입니다. 이 함수 표현은 메 developer.mozilla.org function 표현에 비해 구문이 짧고 자신의 this, arguments, super 또는 new.target을 바인딩 하지 않습니다. 이 함수 표현은 메소드 함수가 아닌 곳에 가장 적합하다. 구문) (param1, param2, …, paramN) => { statements } (param1, param2, …, paramN) =>..

배열 내의 모든 요소 각각에 대하여 주어진 함수를 호출한 결과를 모아 새로운 배열을 반환합니다. Array.prototype.map() - JavaScript | MDN map() 메서드는 배열 내의 모든 요소 각각에 대하여 주어진 함수를 호출한 결과를 모아 새로운 배열을 반환합니다. developer.mozilla.org 구문 arr.map(callback(currentValue[, index[, array]])[, thisArg]) callback - 새로운 배열 요소를 생성하는 함수. 다음 세 가지 인수를 가진다. 1. currentValue - 처리할 현재 요소. 2. index (optional) - 처리할 현재 요소의 인덱스. 3. array (optional) - map()을 호출한 배열. ..

모든 Selector 적용보기. Try jQuery Selector My name is Donald Duck I live in Duckburg I have many friends: www.w3schools.com Selector Selectors | jQuery API Documentation Select all elements that are in the progress of an animation at the time the selector is run. Selects elements that have the specified attribute with a value either equal to a given string or starting with that string followed by a h..

jQuery What is jQuery? jQuery is a fast, small, and feature-rich JavaScript library. It makes things like HTML document traversal and manipulation, event handling, animation, and Ajax much simpler with an easy-to-use API that works across a multitude of browsers. jquery.com 자바스크립트 언어를 간편하게 사용할 수 있도록 단순화시킨 오픈 소스 기반의 자바스크립트 라이브러리 장점 주요 웹 브라우저의 구버전을 포함한 대부분의 브라우저에서 지원. 문서 객체 모델(DOM)과 이벤트에 관한 처리를 손쉽..

주어진 함수의 테스트를 통과하는 모든 요소를 모아 새로운 배열로 반환한다. Array.prototype.filter() - JavaScript | MDN filter() 메서드는 주어진 함수의 테스트를 통과하는 모든 요소를 모아 새로운 배열로 반환합니다. developer.mozilla.org 구성 arr.filter(callback(element[, index[, array]])[, thisArg]) callback - 각 요소를 시험할 함수. true를 반환하면 요소를 유지, false를 반환하면 버린다. 다음 세 가지 매개변수를 받는다. element - 처리할 현재 요소. index(Optional) - 처리할 현재 요소의 인덱스. array(Optional) - filter를 호출한 배열. th..

명언만들기 명언을 넣은 array를 만들어준다. const saying = [ {a : "유행은 유행에 뒤떨어질 수 밖에 없게 만들어진다.", b : "가브리엘(코코)샤넬"}, {a: "미래는 탁한 거울이다. 누구든 들여다 보려 하면 늙고 근심 어린 얼굴의 희미한 윤곽만 볼 뿐이다.", b: "짐 비숍" }, {a: "현재뿐 아니라 미래까지 걱정한다면 인생은 살 가치가 없을 것이다.", b: "윌리엄 서머셋 모옴"}, {a: "일 분 전만큼 먼 시간은 없다.", b: "짐 비숍"}, {a: "당신은 지체할 수도 있지만 시간은 그러하지 않을 것이다.", b: "벤자민 프랭클린"}, {a: "미래에 사로잡혀있으면 현재를 있는 그대로 볼 수 없을 뿐 아니라 과거까지 재구성하려 들게 된다.", b: "에릭 호퍼..