반응형
matches()는 요소가 특정 CSS 선택자와 일치하는지 확인하는 메서드입니다.
contains()는 문자열에 특정 문자열이 포함되어 있는지 확인하는 메서드입니다.
두 메서드는 서로 다른 용도로 사용됩니다.
matches() 메서드
사용법: element.matches(selectorString)
- 요소가 지정된 CSS 선택자와 일치하는지 확인합니다.
- 일치하면 true, 그렇지 않으면 false를 반환합니다.
- 주로 DOM 요소의 클래스, 태그 이름, 속성 등을 확인할 때 사용합니다.
const element = document.querySelector('div.my-class');
if (element.matches('div.my-class')) {
console.log('The element matches the selector!');
} else {
console.log('The element does not match the selector.');
}
contains() 메서드
사용법: string.contains(searchString)
- 문자열에 특정 문자열이 포함되어 있는지 확인합니다.
- 포함되어 있으면 true, 그렇지 않으면 false를 반환합니다.
- 주로 문자열 검색에 사용됩니다.
const myString = 'Hello, world!';
if (myString.contains('world')) {
console.log('The string contains "world".');
} else {
console.log('The string does not contain "world".');
}
차이점
- matches()는 요소가 특정 CSS 선택자와 일치하는지 확인하는 메서드입니다.
- contains()는 문자열에 특정 문자열이 포함되어 있는지 확인하는 메서드입니다.
- matches()는 DOM 요소를 대상으로 하고, contains()는 문자열을 대상으로 합니다.
반응형
'Javascript' 카테고리의 다른 글
Javascript 문자열 검색3. search(), match() (0) | 2024.04.28 |
---|---|
Javascript 문자열 검색2. indexOf(), includes() (0) | 2024.04.28 |
자바스크립트에서 인덱스를 찾는 다양한 방법 (0) | 2023.09.09 |
사이즈 관련 속성과 함수 및 위치 값 구하기 (0) | 2023.08.17 |
Element.animate() (0) | 2023.07.28 |
댓글