jQuery 나 CSS를 사용할 때 다중 레벨/트리 선택기에 정당한 가치가 있습니까?

Question

구조화 된 마크 업을 유지하는 것 외에도 CSS 또는 jQuery와 관련하여 다중 레벨/트리 선택기를 사용하는 정당한 이유가 있습니까?

내가 다단계에 의해 무엇을 의미/트리 선택기 :

$('#grand-parent > #parent > .child').doSomething();

#grand-parent #parent .child

나는 종종 사람들이 DOM에 다른 요소가 없다하더라도, 선택의이 유형을 사용하여 참조

따라서 .child의 클래스와 함께, 왜 내가/그 이유가 최종 선택기 (.child) 한 번만 존재하는 시나리오에서 그것을 사용하는 이유가 있는지 궁금하네요?

이것은 주관적이지 않으므로 진짜 대답을 가질 수있는 질문입니다. 필자가 필요성이나 이유를 말할 때 성능 향상이나 요소가 이러한 방식으로 선택되지 않을 때 발생할 수있는 오류와 같은 것을 의미합니다.

또 하나의 질문으로, CSS가 있거나없는 CSS를 보았을 것이라는 확신을 가지고 있기 때문에 jQuery 셀렉션보다 더 큰 기호가 필요합니다. >

다단계 선택기 사용에 대한 답변/설명은 크게 감사하겠습니다.

여러분 안녕하세요!

Answer 1

아무런 문제없이 # MyID.Myclass처럼 선택자를 만들었으므로> 기호가 필요하지 않습니다. 성능에 관해서는 DOM에서 모든 것을 반복 할 필요가 없다면 컨트롤을 얻는 것이 가장 좋습니다. 그러나 만약 당신이 뒤 따르는 것이 클래스 일 뿐이라면 그것을 걸러 낼 이유가 없습니다. 또한 다른 포스터는 부서지기 쉬운 코드를 만드는 것에 대해 정확합니다. 로컬 클라이언트의 처리 능력이 무거워 지므로 발생할 수있는 프로그래밍 오류 및 복잡성에 비해 데이터를 잡는 데 몇 분의 일이 소요됩니다.

Answer 2

선택기가 중첩 가능한 요소를 포함 할 때 가끔 유용 :

$('dl.main-list > dt').css('font-weight', 'bold'); 

중첩 <dl> 목록이 엉망이되지 않는 방법.

그러나 일반적으로 내 예제와 같은 외부의 문서 구조에 대한 가정은 매우 취약합니다.

Answer 3

"스크립트에서 마크 업 분리"를 옹호하는 사람들은 항상 혼란 스럽습니다. 그런 다음 복잡한 선택기를 사용하여 레이아웃을 기반으로 요소에 액세스합니다. 복잡한 선택기를 사용하는 것은 스타일링 관점에서 이해가되지만, 복잡해 지더라도 유지 보수가 더 어려워집니다.