CSS 우리는 다음과 같은 코드가 있다고 가정하자 특정 속성

Question

을 가진 요소에서 첫 번째 자식을 선택

<node> 
    <element bla="1"/> 
    <element bla="2"/> 
    <element bla="3"/> 
    <element bla="3"/> 
    <element bla="3"/> 
    <element bla="4"/> 
</node> 

어떻게 3 동일한 속성 한 첫 번째 자식을 선택 가겠어요? 나는 아마이 일 할 수 있다고 생각했다 :

element[bla="3"]:first-child 

을 ...하지만 :first-child 의사 클래스는 첫 번째 자식 노드에서 보이는

Answer 1

작동하지 않았다, 그래서 첫 번째 자식 ISN 경우 ' t element[bla="3"]이면 아무 것도 선택되지 않습니다.

속성에 유사한 필터 의사 클래스가 없습니다. 이 주위에 쉬운 방법은 모든 사람이 다음 (이 트릭은 here 및 here 설명) 처음 다음에 오는 것을 제외 선택하는 것입니다 :

element[bla="3"] { 
} 

element[bla="3"] ~ element[bla="3"] { 
    /* Reverse the above rule */ 
} 

이를 물론, 단지 스타일을 적용 작동; 당신은 (마크 업이 아니라 HTML보다는 임의의 XML을 것으로 보인다 이후) 스타일 이외의 목적으로 해당 요소를 선택하려는 경우, 당신은 document.querySelector()처럼 다른 뭔가를 사용해야합니다 :

var firstChildWithAttr = document.querySelector('element[bla="3"]'); 

또는 XPath 식을 :

//element[@bla='3'][1]