CSS 속성이 지원되는지 여부를 JS에 체크인 하시겠습니까?

Question

CSS 속성 pointer-events (see documentation)이 사용자의 브라우저에서 지원되는지 여부를 확인하고 싶습니다.

현재 예를 들어 Opera에서 지원하지 않으며 IE의 일부 버전을 사용합니다.

자바 스크립트로 체크를 실행하고 지원 여부에 따라 적절한 HTML 비트를 표시하고 싶습니다.

사용자 에이전트 문자열을 검사하는 것보다 더 나은 방법이 있습니까?

Answer 1

나는

if ("pointer-events" in document.body.style) 

또는

if ("pointerEvents" in document.body.style) 

이 SVG 콘텐츠의 경우에 적합해야합니다 생각합니다.

Answer 2

다음 모두 IE 9, 파이어 폭스에서 true로 평가 : 비 SVG 콘텐츠에 대한

if ('pointerEvents' in document.documentElement.style) 

Answer 3

이 스크립트가 작동해야합니다
https://github.com/ausi/Feature-detection-technique-for-pointer-events

또한 모더 나이저없이 사용할 수 있습니다

var pointerEventsSupported = (function(){ 
    var element = document.createElement('x'), 
     documentElement = document.documentElement, 
     getComputedStyle = window.getComputedStyle, 
     supports; 
    if(!('pointerEvents' in element.style)){ 
     return false; 
    } 
    element.style.pointerEvents = 'auto'; 
    element.style.pointerEvents = 'x'; 
    documentElement.appendChild(element); 
    supports = getComputedStyle && 
     getComputedStyle(element, '').pointerEvents === 'auto'; 
    documentElement.removeChild(element); 
    return !!supports; 
})(); 
if(pointerEventsSupported){ 
    // do something 
}