{ const searchBox = document.querySelectorAll(".search span"); //알파벳 버튼들 변수에 저장 const cssList = document.querySelectorAll(".list ul li"); //속성 리스트 변수에 저장 const cssCount = document.querySelector(".count em"); //속성 갯수 변수에 저장 //모든 데이터 보이기 cssList.forEach((li, index) => { li.classList.add("show"); //cssList에 show 추가 cssCount.innerText = index; //갯수 카운트 }) //알파벳을 클릭하면 클릭한 데이터 값을 가져와야 한다. searchBox.fo..
indexOf { const searchBox = document.querySelector("#search-box"); //search Box 변수에 저장 const cssList = document.querySelectorAll(".list ul li"); //다수의 li를 변수에 저장 const cssCount = document.querySelector(".count em"); //em을 변수에 저장 cssList.forEach((element, index) => { //cssList에 있는 모든 li태그에 show 클래스 추가 element.classList.add("show"); console.log(index); cssCount.innerHTML = index + 1; //cssCount의 e..
indexOf { const searchBox = document.querySelector("#search-box");//search-box 변수에 저장 const cssList = document.querySelectorAll(".list ul li");//다수의 li를 변수에 저장 searchBox.addEventListener("keyup", () => {//input를 클릭했을 때 이벤트 설정 const searchWord = searchBox.value; //사용자가 입력한 데이터 저장소 // console.log(searchWord); cssList.forEach(el => { //다수의 li한테 적용 console.log(el.dataset.name) const cssName = el.dat..