12.4. Option B: jQuery

사이드바 메뉴 요소와 같이 숨기는 복잡한 요소가 있는 경우, 몇 가지를 사용하는 것이 좋습니다. 이러한 요소의 CSS 경로는 Dashboard 및 Account 섹션에서 동일하며 두 섹션의 요소를 숨기는 것을 원하지 않습니다. 따라서 CSS 경로와 컨텐츠에 따라 요소를 선택하십시오. 이 예에서는 대시보드의 사이드바에서 messages 섹션을 숨기고 있다고 가정합니다. CSS 경로는 다음과 같습니다.

#three-scale #submenu li a

콘텐츠와 일치하려면 .text() 함수를 사용합니다. 또한 문서의 헤드와 준비 함수 내에 코드를 포함하므로 모든 내용이 생성된 후에 실행됩니다.

개발자 포털에서 기본 페이지 수정

결과 코드 조각은 다음과 같습니다.

$(function() {
  $('#three-scale #submenu li a').each(function() {
    if ($(this).text() == "Messages")
      $(this).parent().css('display', 'none');
  });
});

이것이 유일한 솔루션이 아닙니다. 가능한 한 가지 방법을 보여 줍니다. 동일한 예는 속성 값에 기반하는 CSS3 선택기와 함께 순수 CSS를 사용하여 수행할 수 있습니다. 전체 CSS3 선택기 사양을 보려면 여기를 참조하십시오.