JavaScript\'querySelector()\' 및 \'querySelectorAll()\'에 요소 이름 일치를 위한 와일드카드 방법이 있습니까?

JavaScript에서 "querySelector()" 및 "querySelectorAll()"과 일치하는 와일드카드 요소 이름

문제:

이름에 특정 문자열이 포함된 요소가 있는 XML 문서를 쿼리하는 것은 어려울 수 있습니다. CSS는 속성 쿼리에 대해 와일드카드를 지원하지만 요소 이름에는 동일한 기능이 누락된 것 같습니다.

해결책:

안타깝게도 와일드카드 요소를 일치시키는 간단한 방법은 없습니다. "querySelector()" 또는 "querySelectorAll()"을 사용하여 이름을 지정합니다. 그러나 대체 접근 방식도 있습니다.

• 속성 일치: CSS는 속성 값에 와일드카드를 제공합니다. 이름에 특정 문자열이 있는 요소를 일치시키려면 다음 구문을 사용하여 해당 속성 내에서 해당 문자열이 있는지 확인하세요.

  • [attribute^='value']는 속성이 시작하는 요소와 일치합니다. with 'value'.
  • [attribute$='value']는 속성이 'value'로 끝나는 요소와 일치합니다.
  • [attribute*='value']는 속성에 'value'가 포함된 요소와 일치합니다. '.
• 이름 속성: 'name' 속성을 일치시키려면 위 표현식에서 'id'를 'name'으로 대체하면 됩니다.

예:

'name' 속성에 'name' 문자열이 있는 모든 요소를 ​​찾으려면 다음을 사용할 수 있습니다.

<code class="javascript">const elementsWithName = document.querySelectorAll('[name*="name"]');</code>

참고:

요소 태그 이름 자체에 대한 와일드카드 일치를 원하는 경우 현재 "querySelector()" 또는 "querySelectorAll()"을 사용하는 직접적인 솔루션은 없습니다.

위 내용은 JavaScript\'querySelector()\' 및 \'querySelectorAll()\'에 요소 이름 일치를 위한 와일드카드 방법이 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!