CSS 선택 계층 세그먼트

Question

그래서 나는 이상한 질문이 있습니다. 클래스를 기반으로 계층 구조의 세그먼트를 선택하는 선택기를 만드는 방법은 무엇입니까? 하지() 의사 클래스 : 예를 들어 나는이

.start-selection, .start-selection *:not(.end-selection, .end-selection *){ 
    /*styling...*/ 
} 

처럼 뭔가 생각하지만 당신은 복합 선택기가 기운 때문이 작동하지 않는 것

<node class="start-selection"> 
    <node> 
     <node>content affected</node> 
    </node> 

    <node> 
     <node>content affected</node> 
    </node> 

    <node class="end-selection"> 
     <node> 
      <node>content not affected</node> 
     </node> 
    </node> 

    <node> 
     <node>content affected</node> 
    </node> 
</node> 

같은 것을 원한다. JavaScript를 사용하여이 작업을 수행 할 수있는 유일한 방법은 무엇입니까? 감사.

Answer 1

순수 CSS로해야합니까 불가능하지만 약간의 스크립트가 트릭을

var els = document.querySelectorAll(".end-selection *"); 
for (i = 0; i < els.length; i++){ 
    els[i].className += " end-selection-child"; 
} 

그리고 CSS를 수행해야합니다

.start-selection *:not(.end-selection):not(.end-selection-child){ 
    background:blue; 
} 

데모 : 내가 볼 https://codecanister.com/Project/d547eed9/3/result

Answer 2

CSS 만 사용하는 것은 정말 불가능합니다. 100 %.