JS 라이브러리를 사용하지 않는 스트레이트 JavaScript 솔루션을 선호하는 경우 배경 이미지의 쿼리 문자열을 사용하여 CSS에 "사용자 정의 속성"을 유지할 수 있습니다.
HTML
<div id="foo">hello</div>
CSS
#foo {
background: url('images/spacer.gif?bar=411');
}
자바 스크립트
getCustomCSSProperty('foo', 'bar');
지원하는 자바 스크립트 함수
function getCustomCSSProperty(elId, propName)
{
var obj = document.getElementById(elId);
var bi = obj.currentStyle ? obj.currentStyle.backgroundImage : document.defaultView.getComputedStyle(obj, null).getPropertyValue('background-image');
var biurl = RegExp('url\\(["\\\']?([^"\\\']+)["\\\']?\\)').exec(bi);
return getParameterByName(propName, biurl[1]);
}
function getParameterByName(name, qs) {
var match = RegExp('[?&]' + name + '=([^&]*)').exec(qs);
return match && decodeURIComponent(match[1].replace(/\+/g, ' '));
}
데모 : http://jsfiddle.net/t2DYk/1/
설명 : 내가 IE 5.5-9, 크롬, 파이어 폭스, 오페라에서 솔루션을 테스트 한 http://refactorer.blogspot.com/2011/08/faking-custom-css-properties.html
, 및 사파리.
예는 실제 CSS 사양과 같습니다 :) – galymzhan