xpath 위치 지정과 CSS 위치 지정의 차이점은 무엇입니까?

차이점: 1. XPATH의 직접 하위 요소는 "/"를 사용하여 정의되는 반면 CSS에서는 ">"를 사용하여 정의됩니다. 요소가 다른 요소(하위 요소 또는 손자 요소) 내에 있는 경우 XPATH에서는 "//"를 사용하고 CSS에서는 공백만 사용하여 정의됩니다.

이 튜토리얼의 운영 환경: Windows 7 시스템, CSS3 버전, Dell G3 컴퓨터.

xpath의 일반적인 위치 지정 방법

xpath 위치 지정과 CSS 위치 지정 비교

Xpath 위치 지정과 CSS 위치 지정은 실제 프로젝트에서 더 일반적으로 사용됩니다. XPath는 XML 문서에서 노드를 찾는 구문입니다. 즉, 해당 경로를 통해 이 요소를 찾을 수 있습니다. Xpath는 더 강력하고 CSS 선택기는 성능이 더 좋고 더 빠르게 실행되며 구문이 더 간단합니다. 두 가지 방법을 비교해 보세요.

직접 하위 요소

XPATH의 직접 하위 요소는 "/"를 사용하여 정의되는 반면 CSS에서는 ">"를 사용하여 정의됩니다.

XPATH：//div/input
CSS: div>input

하위 요소

요소가 다른 요소(자식 또는 손자) 안에 있는 경우 XPATH에서는 "//"를 사용하고 CSS에서는 공백만 사용하여 정의됩니다.

XPATH：//div//input
CSS: div input

ID 위치 지정

XPATH의 요소 ID는 "[@id='kw']"를 사용하여 정의되는 반면 CSS에서는 "#kw"로 사용됩니다.

XPATH：//input[@id='kw']
CSS: input#kw

【추천 튜토리얼: CSS 동영상 튜토리얼】

CLASS positioning

class 속성의 경우 XPATH는 id와 유사하지만 CSS는 점으로 표시됩니다.

XPATH：//input[@class="s_ipt"]
CSS: input.s_ipt

동생 요소: follow-sibling step-sibling

이는 양식 요소, 즉 동일한 상위 노드 내에 있는 페이지의 다음 인접 요소에 유용합니다.

XPATH：//input[@class="s_ipt"]/following-sibling::a
CSS：input[class="s_ipt"]+a

Brother 요소: 선행-형제 동일한 상위 노드에 있는 페이지의 이전 인접 요소입니다.

XPATH：//a[@name='tj_baike']/preceding-sibling::a
CSS：无法实现

상위 노드 요소

페이지에 있는 노드의 상위 요소입니다.

XPATH: //input/parent
CSS: 无法实现

속성 값

모든 속성 값을 기반으로 요소를 배치할 수 있습니다.

XPATH: //input[@name='username']
CSS: input[name='username']

다중 속성 값

다중 속성을 통해 요소의 위치를 ​​지정할 수도 있습니다.

XPATH: //input[@name='rsv_spt' and @value="1"]
CSS: input[name='login'][type='submit']

첫 번째 하위 요소

XPATH: //div[@id='u1']/a[1]
CSS: div#u1 a:first-child

마지막 하위 요소

XPATH: //div[@id='u1']/a[last()]
CSS: div#u1 a:last-child

두 번째 하위 요소

XPATH: //div[@id='u1']/a[2]
CSS: div#u1 a:nth-child(2)

퍼지 일치

selenium中允许使用^=，$=或*=进行部分字符串匹配。

^=접두어 일치

XPATH: input[starts-with(@id,'user')]
CSS: input[id^='user']

$= 일치하는 접미사

XPATH: input[ends-with(@id,'name')]
CSS: input[id$='name']

*=일치에는

XPATH: input[contains(@id,'sernam')]
CSS: input[id*=sernam]

가 포함됩니다. 더 많은 프로그래밍 관련 지식을 보려면 프로그래밍 비디오를 방문하세요! !

위 내용은 xpath 위치 지정과 CSS 위치 지정의 차이점은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!