const는 변수를 선언하는 방법 중 하나로, 상수(constant)로 선언된 변수는 재할당할 수 없습니다. API 키, URL, 설정 객체 등 변경되지 않는 값을 저장할 때 사용됩니다.
위의 코드는 API 키와 기본 URL을 상수로 선언하여 나중에 코드에서 재사용할 수 있도록 합니다. 이 값들은 한 번 설정되면 변하지 않으므로 const로 선언하는 것이 적절합니다.
querySelector 메서드는 주어진 CSS 선택자 문자열과 일치하는 문서 내의 첫 번째 요소를 반환합니다. 이 메서드는 특정 요소를 선택하고 해당 요소를 조작할 수 있도록 해줍니다.
const searchInput = document.querySelector("#search-input");
querySelector는 HTML 문서 내에서 id가 search-input인 요소를 선택합니다. 이 요소는 검색 입력 필드입니다. 선택한 요소를 변수에 저장하여 나중에 해당 요소를 조작할 수 있습니다.
const moviesContainer = document.querySelector(".movies");
appendChild method는 특정 부모 노드의 자식 노드 목록 끝에 새로운 자식 노드를 추가합니다. 이 메서드는 새로운 요소를 기존의 HTML 구조에 동적으로 추가할 때 사용됩니다.
const moviesContainer = document.querySelector(".movies");
const movieCard = document.createElement("div");
movieCard.classList.add("movie-card");
moviesContainer.appendChild(movieCard);
querySelector로 movies 클래스를 가진 요소를 선택합니다.
createElement로 새로운 div 요소를 생성합니다.
classList.add로 생성한 div 요소에 movie-card 클래스를 추가합니다.
appendChild로 생성한 div 요소를 movies 클래스를 가진 요소의 자식으로 추가합니다.
프로그래머스 두정수 사이의 합 js (0) | 2024.07.29 |
---|---|
css 글자색 바꾸기 (0) | 2024.07.27 |
class Vs function (0) | 2024.07.26 |
link tag (0) | 2024.07.24 |
placeholder ,form (3) | 2024.07.24 |