css: .test { width :200px; height:200px;
background-color:#33557b; }
<head>
<link rel="stylesheet" type="text/css" href="my.css">
<script type="text/javascript">
function SetStyle(className, key, value)
{
var classes = document.styleSheets[0].rules || document.styleSheets[0].cssRules;
for (var x = 0; x < classes.length; x++)
{
if (classes[x].selectorText == className)
{
var y = classes[x].style ? classes[x].style : classes[x].style;
y[key] = value;
}
}
}
</script>
</head>
<body>
<div class = "test">
</div>
<script>
eval(SetStyle(".test", 'backgroundColor', '#000'));
</script>
</body>
Суть такая: хочу динамически менять свойства объекта в css, например будь то фон или еще что. Так вот, написал код что выше - в IE и FireFox запускается нормально, а в Google Chrome данный код не отрабатывает! В Chrome выскакивает ошибка, мол classes.lenght = Uncaught TypeError: Cannot read property '0' of null
. Как исправить данную проблему?
Поясню: создается квадрат синим цветом; после отработки javascript - он становится черным (по логике так должно быть). Прошу помощи комрады!
eval
я бы руки отрывал xDDD почитать тут