searchEffect01 - indexOf()

 

searchBox.addEventListener("keyup", () => { //input를 클릭했을 때 이벤트 설정
    const searchWord = searchBox.value; //사용자가 입력한 데이터 저장소 console.log(searchWord);  //사용자가 입력한 데이터 저장소 변수에 저장

    cssList.forEach(el => {  //다수의 li을

        const cssName = el.dataset.name; //CSS 속성 값을 변수에 저장

        if(cssName.indexOf(searchWord)){ //사용자가 입력한 값에 데이터가 있는지 확인
            el.classList.add("hide"); //데이터가 있으면 클래스 hide를 추가
        } else {
        el.classList.remove("hide"); //데이터가 없으면 클래스 hide를 삭제
        }
    })
});

indexOf()

기본형

String.prototype.indexOf()

설명

indexOf() 메서드는 호출한 String 객체에서 주어진 값과 일치하는 첫 번째 인덱스를 반환합니다. 일치하는 값이 없으면 -1을 반환합니다.

indexOf() 검색효과 사이트

indexOf() 참고 사이트1

indexOf() 참고 사이트2