ふとんのなかから

びまん性大細胞型B細胞リンパ腫にかかったあとだらだらしている人のブログ

Javascript上からCSSを操作する方法

ソース:

<html>
<head>
<script language="JavaScript">
counter=1;
function Test(){
if(counter==1){
document.getElementById("content").style.background = "blue";
counter=2;
}else if(counter==2){
document.getElementById("content").style.background = "green";
counter=1;
}
setTimeout("Test()",5000);
}
</script>
</head>
<body id="content" onload="Test()">
</body>
</html>


解説:

  • プロパティを何も設定していない、ID名「content」のCSS要素に対して「background = "blue"」で背景色を青に設定している。
  • 上記例ではifやsetTimeoutと組み合わせて、5秒ごとに背景色プロパティが「青→緑」に変わり、ページ上に反映されるスクリプトになっている。