Chrome에서 배경색을 올바르게 설정하고 질문하기 (자바 스크립트)

Question

다음은 빨간색 배경을 가진 텍스트를 조작하는 Chrome 개발 도구 콘솔 세션입니다.

background-color과 backgroundColor의 차이가이 경우에 홀수로 나타납니다.

> document.getElementById('38').style.backgroundColor = 'red' 
"red" 

> window.getComputedStyle(document.getElementById('38')).getPropertyValue('background-color') 
"rgb(255, 0, 0)" 

> window.getComputedStyle(document.getElementById('38')).getPropertyValue('backgroundColor')` 
null 

어떻게 설명 할 수 있습니까?

텍스트가 브라우저에서 빨간색으로 바뀌지 만 API가 약간 이상하게 보일 수 있습니다. 무엇이 잘못 될 수 있습니까? Mozilla docs.style에 따르면

Answer 1

은 요소

<div style="background-color: red"></div>

의 "스타일"속성을 통해 요소의 CSS 속성을 수정하는 데 사용하지만, 그것은 당신에게 요소의 스타일 상태의 전체 표현을 제공하지 않습니다 즉 .style에 계산 된 스타일이 모두 포함되어 있지 않습니다.

Here.style과 함께 사용되는 CSS 속성에 사용할 수있는 바로 가기를 볼 수 있습니다. 'background-color' 및 .style에 사용되는 바로 가기 - - 배경에 대한 첫 번째 열에서이 목록에서

우리가 원래의 CSS 속성의 이름이 'backgroundColor'

는 .getPropertyValues(prop)가 첫 번째 열 prop = 'background-color'에서 값을 사용하는 것 사용을, 즉 CSS 원래 속성 이름과 매우 비슷 함

.style[prop]의 경우 두 번째 열의 값을 사용합니다. prop = 'backgroundColor'. 거기에 크롬 콘솔 세션을 코드 강조하는 방법을 보여주는

Question with a similar problem