2013-02-12 2 views
3

전자 상거래 저장소의 정적 프레임 워크 CSS를 편집하고 있습니다. 나는 그것을 많이 편집 할 수는 없지만 CSS의 특정 요소를 대상으로 n 번째 자식을 사용하고 있습니다. 문제는 동적으로 생성 된 div, 테이블 및 범위의 많은 클래스 또는 ID 선택기가없는 것입니다. 이 같은 CSS 선택기의 많은이 그래서 프레임 워크는 테이블에 내장되어 있습니다 :요소가있는 n 번째 자식 찾기

.sample_CSS_class table:nth-child(5) table 

클래스 "sample_CSS_class"와 사업부에서 다섯 번째 테이블에 포함 된 것 테이블을 대상 곳입니다. 그래도 시간이 많이 걸릴 수 있습니다. Google 크롬 관리자 (또는 방화 켓)에 들어가서 소스 코드를 확장 한 다음 거기에서 카운트 다운해야합니다. 코드가 너무 많아서 실수를 할 수 있으며 시간이 좀 걸립니다.

방화범이나 Google 크롬 검사기 (또는 다른 도구가있는 곳)와 같이 요소의 n 번째 자식 번호를 찾는 효과적인 방법을 아는 사람이 있는지 궁금합니다. 감사! 크롬

+0

이 테스터는 유용 할 수 있습니다. http://lea.verou.me/demos/nth.html –

+0

어딘가에 앱이 있습니까? 그것도 너무 이론적이다. –

+0

다양한 xpath 도우미 도구가 있습니다. 요소 xpath를 볼 때 괄호 안의 마지막 숫자는 해당 요소의 자식 순서 번호입니다. 마우스 오른쪽 버튼 클릭 -> XPath를 대상 요소에서 클릭하여 크롬 인스펙션에서 확장 프로그램을 사용하지 않고도이 작업을 수행 할 수 있습니다.하지만 어딘가에 붙여 넣기 만하면 지루할 수 있습니다. –

답변

8

, 당신은 일종의을 수행 할 복사 XPath를 상황에 맞는 메뉴 항목을 사용할 수 있습니다

XPath stuff

그것은 당신이처럼 보이는 XPath를 선택주지 :

//*[@id="sidebar"]/div[4]/div/div[13] 

div[13]div:nth-child(13)과 같습니다. Chrome이 복사 CSS 옵션을 가지고 있다면 정말 좋겠지 만 어떤 이유로는 그렇지 않습니다. 어쩌면 누군가가 연장을 할 것입니다.

관련 문제