我才12岁 ?

很多初学者会对标签云效果（不了解？就我这里的头部那些标签）感兴趣，其实使用 JavaScript 制作起来是相当容易的，原理很简单，就是随机为每一个标签添加样式，只需要用到 Math.random() 和 Math.floor(x)。

先看 HTML 代码：

<div id="tags_cloud">
    <a href="#">12岁</a> <a href="#">12岁</a> <a href="#">12岁</a> <a href="#">12岁</a> <a href="#">12岁</a> <a href="#">12岁</a> <a href="#">12岁</a> <a href="#">12岁</a> <a href="#">12岁</a> <a href="#">12岁</a> <a href="#">12岁</a> 
</div>

然后我们在 JavaScript 里边这么写：

function addLoadEvent(func) {
    var oldonload = window.onload;
    if (typeof window.onload != 'function') {
        window.onload = func;
    } else {
        window.onload = function() {
        oldonload();
        func();
        }
    }
}


function tagCloud() {
    if(document.getElementById("tags_cloud")) {
        var tags = document.getElementById("tags_cloud");
        var tagLinks = tags.getElementsByTagName("a");
        var styles = new Array();
        styles[0] = new Array("#FF0000","FFCC00","FF9900","#0099FF","#999999"); //设定字体的颜色随机的种类
        styles[1] = new Array("12px","14px","16px"); //设定字体的大小随机的种类
        styles[2] = new Array("400","500","600","700"); //设定字体的粗细随机的种类
        for(var i=0; i<tagLinks.length; i++) {
            tagLinks[i].style.color = styles[0][Math.floor(styles[0].lengthMath.random())]; //设定字体的颜色
            tagLinks[i].style.fontSize = styles[1][Math.floor(styles[1].lengthMath.random())]; //设定字体的大小
            tagLinks[i].style.fontWeight = styles[2][Math.floor(styles[2].length*Math.random())]; //设定字体的粗细
        }
    }
}

addLoadEvent(tagCloud);