SearchEffect03 - charAt()

        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");
            cssCount.innerText = index;
        })
        //알파벳을 클릭하면 클릭한 데이터 값을 가져와야 한다.
        //searchBox.addEventListener is not a function
        searchBox.forEach(el => {
            el.addEventListener("click", () => {
                const searchWord = el.innerText;            //알파벳 첫글자
                //console.log(searcWord)
                cssList.forEach(el => {
                    const cssName = el.dataset.name;       //CSS 속성 값
                    const cssType = el.dataset.type;       //CSS 유형 값
                    //console.log(cssName)
                    //알파벳 첫글자(a) == CSS 속성의 첫글자(a)
                    if(searchWord.charAt(0) === cssName.charAt(0) || searchWord.charAt(0) === cssType.charAt(0)){
                        el.classList.add("show");
                    } else {
                        el.classList.remove("show");
                    }
                })
            })
        })