HTML selector
⭐️ querySelector ⭐️
특정 name 이나 id 를 제한하지않고 css selector를 사용하여 요소 선택
🔥 (같은 이름의 selector가 있을 경우 첫 요소 선택)
-
querySelector('#abc')
id = 'abc' 인 요소 선택 -
querySelector('.abc')
class = 'abc' 인 요소 선택 -
querySelector('[name="abc"]')
속성 name = 'abc' 인 요소 선택
자식 요소 선택
- querySelector('.abc [value=1]')
class = 'abc' 인 요소의 자식 요소 중 속성 value=1 인 요소 선택
⭐️ querySelectorAll ⭐️
선택자에 해당하는 모든 요소 선택 🔥 배열로 변환 🔥
-
querySelectorAll('#abc')
id = 'abc' 인 요소 모두 선택 -
querySelectorAll('.abc')
class = 'abc' 인 요소 모두 선택 -
querySelectorAll('[name="abc"]')
속성 name = 'abc' 인 요소 모두 선택
자식 요소 선택
- querySelectorAll('.abc [value=1]')
class = 'abc' 인 요소의 자식 요소 중 속성 value=1 인 요소 모두 선택
🔥 🧑🏾💻 🔥