JavaScript가 잘못된 사용자 정의 CSS 속성 값에 액세스할 수 있습니까?

JavaScript에서 잘못된 사용자 정의 CSS 속성에 액세스

CSS에서는 -- 접두사를 사용하여 사용자 정의 속성을 정의할 수 있습니다. 그러나 JavaScript에서 유효하지 않은 CSS 속성 또는 사용자 정의 CSS 속성의 값에 액세스할 수 있습니까?

질문:

다음 CSS가 주어진 경우:

<code class="css">div {
    -my-foo: 42;
}</code>

나중에 JavaScript에서 특정 div 요소에 대한 -my-foo 속성 값을 결정할 수 있습니까?

답변:

CSSStyleDeclaration에서 유효하지 않은 속성 이름에 액세스하면 그렇지 않습니다. Chrome 및 Firefox와 같은 널리 사용되는 브라우저에서 지원되는 것 같습니다. 지정된 CSS에 대해 CSSStyleDeclaration 객체는 유효한 속성 너비만 포함하고 -my-foo를 건너뜁니다.

흥미롭게도 DOM-레벨-2 스타일 사양에는 지정된 모든 속성이 CSSStyleDeclaration 인터페이스를 통해 사용 가능해야 한다고 명시되어 있습니다. 이 동작을 지원하는 브라우저가 있을 수 있습니다.

DIY 접근 방식:

해결 방법으로 document.getElementsByTagName("style"을 사용하여 원시 CSS 텍스트를 구문 분석할 수 있습니다. )[0].innerText. 하지만 이는 번거로운 접근 방식이 될 수 있습니다.

위 내용은 JavaScript가 잘못된 사용자 정의 CSS 속성 값에 액세스할 수 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!