jQuery를 사용하여 CSS ':after' 선택기를 어떻게 수정할 수 있나요?

jQuery를 사용하여 ":after" 선택기 수정

jQuery를 사용하여 ":after" CSS 선택기에 액세스하면 특정 문제가 발생할 수 있습니다. ":after" 요소는 DOM 외부에 존재하며 직접 접근할 수 없습니다. 그러나 원하는 수정을 달성하기 위한 해결 방법이 있습니다.

사용자 정의 CSS 클래스:

한 가지 접근 방식은 사용자 정의된 ":after" 요소를 사용하여 새 클래스를 만드는 것입니다. 원본보다 우선 적용됩니다. 예를 들면 다음과 같습니다.

.pageMenu .active.changed:after {
    border-top-width: 22px;
    border-left-width: 22px;
    border-right-width: 22px;
}

jQuery 조작:

다음으로 jQuery를 사용하여 대상 요소의 사용자 정의 클래스를 전환합니다.

$('.pageMenu .active').toggleClass('changed');

의사 요소 조작:

또는 "jQuery를 사용하여 CSS 의사 요소 조작(예: :before 및 :after)"에서 의사 요소를 읽거나 재정의하는 추가 기술을 살펴보세요.

위 내용은 jQuery를 사용하여 CSS ':after' 선택기를 어떻게 수정할 수 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!