[JS/HTML/DOM]Element태그 요소 포함 단어 검색(querySelector, class, name, id, DOM 파싱, 와일드 카드, * 별표, */$/^, 자바스크립트)

🔎일반적인 Element 검색

DOM에서 특정 class, id, tag name, name 을 검색하기 위해서 아래와 같은 API들을 사용할 것이다. 

• document.querySelector('셀렉터')
• document.querySelectorAll('셀렉터')
• document.getElementById('아이디')
• document.getElementsByClassName('클래스명')
• document.getElementsByName('이름')

 

🔍포함 단어 검색

특정 단어를 검색하는 것이 아니라 특정 단어가 포함된 요소를 검색하기 위해서는 아래와 같이 사용한다.

어디든 포함되었는지 검색(*)

• document.querySelectorAll('[class*=포함될단어]')
• document.querySelectorAll('[id*=포함될단어]')
• document.querySelectorAll('[name*=포함될단어]')

~로 시작하는 단어 검색(^)

• document.querySelectorAll('[class^=포함될단어]')
• document.querySelectorAll('[id^=포함될단어]')
• document.querySelectorAll('[name^=포함될단어]')

~로 끝나는 단어 검색($)

• document.querySelectorAll('[class$=포함될단어]')
• document.querySelectorAll('[id$=포함될단어]')
• document.querySelectorAll('[name$=포함될단어]')

 

이것을 이용해서 광고 요소들을 검색해서 제거하는 것을 테스트 해보자.