CSS 표현식에서 JavaScript 표현식을 사용하세요. CSS 속성은 JavaScript 표현식의 평가를 기반으로 설정됩니다.
CSS Expression은 다른 브라우저에서는 작동하지 않으므로 크로스 브라우저 코딩에서는 IE용으로 별도로 설정해 주시는 것이 더 유용합니다.
CSS 표현식은 IE5부터 지원됩니다. 다음 코드를 살펴보겠습니다.
배경- color:expression( (new Date()).getHours()%2 ? "#F00" : "#00F" )
위 코드는 CSS 표현식을 사용하여 매시간 배경색을 전환합니다. .
CSS 표현식의 문제점은 계산 빈도가 생각보다 훨씬 높다는 것입니다. 페이지를 표시하고 확대할 때뿐만 아니라 페이지를 스크롤할 때, 마우스를 움직여도 다시 계산됩니다. 표현식이 평가되는 빈도를 추적하려면 CSS 표현식에 카운터를 추가하세요. 페이지 위에서 마우스를 움직이는 것만으로 10,000개 이상의 계산을 쉽게 수행할 수 있습니다.
CSS 표현식 계산 수를 줄이는 한 가지 방법은 처음 실행될 때 지정된 스타일 속성에 결과를 할당하고 CSS 표현식 대신 이 속성을 사용하는 일회성 표현식을 사용하는 것입니다.
페이지 주기 중에 스타일 속성을 동적으로 변경해야 하는 경우 CSS 표현식 대신 이벤트 핸들러를 사용하는 것이 가능한 접근 방식입니다. CSS 표현식을 사용해야 하는 경우 해당 표현식은 수천 번 계산되며 페이지 성능에 영향을 미칠 수 있다는 점을 기억하세요. 사용자가 페이지를 열 때 컴퓨터가 매우 느려질 것이라고 느끼게 하지 마세요.