본문 바로가기
Javascript

JavaScript 문자열 검색. matches() 와 contains()

by 타로 스토리 2024. 4. 28.
반응형

 

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()는 문자열을 대상으로 합니다.

 

반응형

댓글