>  기사  >  웹 프론트엔드  >  jQuery에서 CSS 속성 변경을 어떻게 감지할 수 있나요?

jQuery에서 CSS 속성 변경을 어떻게 감지할 수 있나요?

DDD
DDD원래의
2024-10-31 16:26:30525검색

How can I detect CSS property changes in jQuery?

jQuery로 CSS 속성 변경 감지

JavaScript에서는 DOM L2에 있는 Mutation 이벤트를 사용하여 요소의 CSS 속성 변경을 감지할 수 있습니다. 이벤트 모듈. 이러한 이벤트 중 하나인 DOMAttrModified는 스타일 속성을 포함한 요소 속성의 변경 사항을 특별히 모니터링합니다.

jQuery에서 이 이벤트를 사용하려면 모니터링하려는 요소에 이벤트 리스너를 연결하기만 하면 됩니다. 예:

<code class="js">$("element").on("DOMAttrModified", function(e) {
  if (e.attrName === "style") {
    console.log("Style changed: ", e.prevValue, " -> ", e.newValue);
  }
});</code>

이 코드는 요소의 "style" 속성이 수정될 때마다 이전 및 새 CSS 스타일을 기록합니다.

대안

대상 브라우저에서 DOMAttrModified가 지원되지 않는 경우 대체 접근 방식은 Internet Explorer에서 사용할 수 있는 "propertychange" 이벤트를 사용하는 것입니다. 이 이벤트는 스타일 변경도 감지할 수 있습니다.

참고

DOMAttrModified를 포함한 Mutation 이벤트가 더 이상 사용되지 않는다는 점에 유의하는 것이 중요합니다. 대신 CSS 속성 변경을 포함한 DOM 변경을 모니터링하려면 MutationObserver를 사용하는 것이 좋습니다.

위 내용은 jQuery에서 CSS 속성 변경을 어떻게 감지할 수 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.