JQUERY标签云：给多个超链接逐个添加彩色

我们做网站时，有时需要在某个版块调用标签云，并且不同的链接颜色不一样，形成彩色标签云的效果。如下图：

下面介绍一下如何在自己建网站时，通过JQUERY自动给多个超链接逐个添加彩色效果。代码如下：

HTML代码：

<a href="http://ke.xuewangzhan.net/jz/jd/">做网站公司</a>

<a href="http://ke.xuewangzhan.net/post/393.html">网站培训</a>

<a href="http://ke.xuewangzhan.net/jz/moban/">网站建设</a>

<a href="http://ke.xuewangzhan.net/jz/buzou/">网站制作教程</a>

<a href="http://ke.xuewangzhan.net/wangzhanbuzou/">创建网站步骤</a>

<a href="http://ke.xuewangzhan.net/beijing/" target="_blank">北京网站建设培训</a>

<a href="http://ke.xuewangzhan.net/guangzhou/" target="_blank">广州网站制作培训</a>

<a href="http://ke.xuewangzhan.net/hefei/" target="_blank">合肥建网站培训</a>

<a href="http://ke.xuewangzhan.net/91zixue/" target="_blank">91自学网</a>

<a href="http://ke.xuewangzhan.net/jz/xiaochengxu/">微信小程序教程</a>

<a href="http://ke.xuewangzhan.net/post/1998.html">搭建个人网站</a>

<a href="http://ke.xuewangzhan.net/jz/why/peixuekc/">建站培训</a>

<a href="http://ke.xuewangzhan.net/post/18966.html">网站制作学习</a>

<a href="http://ke.xuewangzhan.net/post/21121.html">做网站需要学习什么</a>

<a href="https://www.xuewangzhan.net/jz/dederumen/" target="_blank">织梦cms建站教程</a>

<a href="http://ke.xuewangzhan.net/jz/photoshop/">PS教程</a>

<a href="http://ke.xuewangzhan.net/jz/kuaisu/">快速建站教程</a>

<a href="http://ke.xuewangzhan.net/jz/qykc/">企业网站制作教程</a>

<a href="https://www.xuewangzhan.net/jz/dzsp/">论坛制作视频教程</a>

<a href="http://ke.xuewangzhan.net/jz/scwz/">电子商城制作教程</a>

<a href="http://ke.xuewangzhan.net/jz/waimao/">外贸网站制作教程</a>

<a href="http://ke.xuewangzhan.net/jz/zh_en/">中英文多语网站制作教程</a>

<a href="https://www.xuewangzhan.net/jz/h5/">HTML5 视频教程</a>

<a href="http://ke.xuewangzhan.net/jz/css3/">CSS3视频教程</a>

<a href="http://ke.xuewangzhan.net/jz/jingtai/">网站前端开发教程</a>

<a href="http://ke.xuewangzhan.net/jz/htkaifa/">网站后台开发教程</a>

<a href="http://ke.xuewangzhan.net/jz/wpmoban/">wordpress模板主题开发</a>

<a href="http://ke.xuewangzhan.net/jz/fzjc/">仿站教程</a>

<a href="https://www.xuewangzhan.net/jz/dederumen/">织梦建站视频教程</a>

<a href="https://www.xuewangzhan.net/">如何做网站</a>

JQUEYR代码：

<script>

function randomColor() {

var color = "";

for (var i = 0; i < 6; i++) {

color += (Math.random() * 16 | 0).toString(16);

}

return "#" + color;

}



var along = $(".side-tags a").length;



for(var i=0;i<along;i++){

$(".side-tags a:nth-child("+(i+1)+")").css("color",randomColor());

}

</script>

通过HTML和JQUERY代码就可以实现给多个超链接逐个添加彩色的标签云效果了。