javascript 3

자바스크립트[JavaScript] | 이벤트 위임(Event Delegation)으로 문제 해결하기

포스팅하게 된 계기 노마드 코더에서 진행하는 멜론 클론코딩 컨테스트에 참여하여 바닐라 JS로 코딩을 하던 중, 버튼을 클릭했을 때 원하는 정보를 가져오는 코드를 작성하던 중에 문제가 발생했다. 이벤트 버블링을 활용한 개념인 이벤트 위임을 이용하여 문제를 해결했고, 내용을 기억하기 위해 정리를 하기로 했다. 문제 음악 차트의 재생 버튼 부분을 구현하던 중이었고 button안에 svg 파일을 추가해 놓았다. 음악의 재생 버튼을 클릭했을 때 노래 제목을 가져와 서버에 보내면 해당 노래의 Youtube 영상을 반환하는 코드를 작성하고 있었다. 노래를 구성하고 있는 li태그의 id에 노래 제목을 적어두었다. ... ... 내가 원하는 동작은 button을 클릭하면 클릭된 노래의 제목 또는 정보를 가져오는 것이었다..

자바스크립트[JavaScript] 002. 자바스크립트의 요소 7가지

안녕하세요! 지난 시간엔 자바스크립트 포스팅의 첫 시작으로 가장 기본적인 개념을 설명드렸어요. 자바스크립트[JavaScript] 001. 자바스크립트? 안녕하세요! 저는 파이썬과 HTML+CSS 공부를 하고 있었는데요. 최근 자바스크립트 공부를 시작했습니다 =) 그래서 오늘부턴 JavaScript에 대해서도 함께 포스팅을 하려고 합니다! 먼저 자바스크립트 jae-yeong.tistory.com (위 글을 참고해주세요!) 오늘은 자바스크립트에서 사용되는 요소들을 소개드리려고 합니다. 1. String(문자열) & Number(숫자열) 알기 2. Function(함수) 알기 3. array(배열) 알기 4. undefined & null 알기 5. Boolean(불린) 알기 1. String(문자열) & N..

자바스크립트[JavaScript] 001. 자바스크립트?

안녕하세요! 저는 파이썬과 HTML+CSS 공부를 하고 있었는데요. 최근 자바스크립트 공부를 시작했습니다 =) 그래서 오늘부턴 JavaScript에 대해서도 함께 포스팅을 하려고 합니다! 먼저 자바스크립트란 뭘까요? 자바스크립트는 프론트 엔드, 백 엔드에 모두 쓰이는 언어여서 알아두면 정말 좋다고 합니다. 주로 동적인 사이트를 제작할 때 많이 사용하는데요. 오늘은 JavaScript(=JS)를 사용할 때 가장 기본적으로 알아두고 있어야 하는 것들을 알려드리려고 합니다~ 1. 변수 변수란 어떤 값을 지정할 수 있는 것이라고 볼 수 있는데요. 데이터를 담는 그릇이라고 이해하시면 더욱 좋습니다. 자바스크립트는 처음에 변수를 선언하며 시작하는데요. var color; 위 코드는 색상이라는 변수를 선언한다!라는 ..