久しぶりに

文字の大きさが表示されるたびに
変わるような機能が欲しくて
地味に作っています。

とりあえず、表示すると、
文字色が赤で大きさが20ｐｘ
なる、、、だけです。

function changeColor() {
elmn = document.getElementById("AAAA");
elmn.style.color = 'red';
elmn.style.fontSize = '20px';
}

body onload="changeColor()"

＜div ID="AAAA" style="float:left">文字＜/div>

配列からランダムで選ぶように変更

var col = new Array();
col = ['red','blue','yellow','green','black'];
var colRand = Math.floor( Math.random() * 5 ) ;

var size = new Array();
size = ['12px','14px','16px','18px','20px'];
var sizeRand = Math.floor( Math.random() * 5 ) ;

elmn = document.getElementById("AAAA");
elmn.style.color = col[colRand];
elmn.style.fontSize = size[sizeRand];

ループにして、
ID指定から
elmn = document.getElementById
class指定にした。
document.getElementsByClassName


for (var i = 0; i < 6; i++) {
var col = new Array();
col = ['red','blue','yellow','green','black'];
var colRand = Math.floor( Math.random() * 5 ) ;

var size = new Array();
size = ['12px','14px','16px','18px','20px'];
var sizeRand = Math.floor( Math.random() * 5 ) ;

elmn = document.getElementsByClassName("rLink"+i);
elmn[0].style.color = col[colRand];
elmn[0].style.fontSize = size[sizeRand];
}


これでも、同名のclassが複数個ある場合は、
後に表示するclassが変更しない。

なので、結構たくさんある場合は
ほかの方法を探さなくてはいけないけど
10個程度なので、
とりあえずこんな感じにしてみた。