여러 클래스 이름이 있는 Div 요소를 어떻게 쿼리할 수 있나요?

여러 클래스 이름으로 Div 요소 쿼리

웹 요소에 여러 클래스 이름이 있는 시나리오에서 클래스 이름에 공백을 사용하는 쿼리는- 분리된 값은 제한된 기능으로 인해 불가능합니다. 이 문제를 해결하기 위해 사용할 수 있는 몇 가지 대체 접근 방식이 있습니다.

XPath 로케이터:

XPath를 사용하면 요소 식별에 여러 기준을 사용할 수 있습니다. 예를 들어, 다음 표현식은 "값" 및 "테스트" 클래스 모두와 요소를 일치시킵니다.

//div[contains(@class, 'value') and contains(@class, 'test')]

CSS 선택기:

CSS 선택기는 간결하고 효율적인 대안. "*" 문자는 클래스 이름 내의 모든 값과 일치시키는 데 사용될 수 있습니다.

div[class*='value test']

지정된 클래스의 순서가 중요하지 않은 경우 다음 선택기를 사용할 수 있습니다.

div.value.test

맞춤 구현:

보다 복잡한 쿼리의 경우 JavaScript 또는 브라우저 API를 사용한 맞춤 구현이 필요할 수 있습니다.

예:

다음 HTML 구조를 고려하세요.

<div class="value test"></div>
<div class="value test     "></div>
<div class="first value test last"></div>
<div class="test value"></div>

다음 표에서는 다양한 접근 방식이 이러한 요소와 어떻게 일치하는지 보여줍니다.

Approach	Matching Elements
By.xpath("//div[@class='value test']")	1
By.xpath("//div[contains(@class, 'value test')]")	1, 2, 3
By.cssSelector("div[class='value test']")	1
By.cssSelector("div[class*='value test']")	1, 2, 3
By.cssSelector("div.value.test")	1, 2, 3, 4

가장 적절한 접근 방식 선택 특정 요소 식별 요구에 따라 개발자는 여러 클래스 이름을 가진 웹 요소를 효과적으로 찾을 수 있습니다.

위 내용은 여러 클래스 이름이 있는 Div 요소를 어떻게 쿼리할 수 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!