随机颜色显示tag标签,很酷很好看。
1,html内容部分
复制代码 代码示例:
<span id=tag style="font-size:13px;">■■■■■</span> <span id=tag style="font-size:13px;">■■■■■</span>
<span id=tag style="font-size:13px;">■■■■■</span> <span id=tag style="font-size:13px;">■■■■■</span>
<span id=tag style="font-size:13px;">■■■■■</span> <span id=tag style="font-size:13px;">■■■■■</span>
<span id=tag style="font-size:13px;">■■■■■</span> <span id=tag style="font-size:13px;">■■■■■</span>
<span id=tag style="font-size:13px;">■■■■■</span> <span id=tag style="font-size:13px;">■■■■■</span>
<span id=tag style="font-size:13px;">■■■■■</span> <span id=tag style="font-size:13px;">■■■■■</span>
<span id=tag style="font-size:13px;">■■■■■</span> <span id=tag style="font-size:13px;">■■■■■</span>
<span id=tag style="font-size:13px;">■■■■■</span> <span id=tag style="font-size:13px;">■■■■■</span>
<span id=tag style="font-size:13px;">■■■■■</span> <span id=tag style="font-size:13px;">■■■■■</span>
<span id=tag style="font-size:13px;">■■■■■</span> <span id=tag style="font-size:13px;">■■■■■</span>
<span id=tag style="font-size:13px;">■■■■■</span> <span id=tag style="font-size:13px;">■■■■■</span>
2,js代码部分
复制代码 代码示例:
<script>
var obj = document.getElementsByTagName("span");
for(i=0;i<obj.length;i++)
{
var str = "0123456789abcdef";
var t = "#";
for(j=0;j<6;j++)
{t = t+ str.charAt(Math.random()*str.length);}
obj[i].style.color=t;
}
</script>
效果如下图:
3,完整代码
复制代码 代码示例:
<!DOCTYPE html>
<html>
<head>
<meta charset="gb2312" />
<title>tag标签用随机颜色显示-www.jb200.com</title>
<script>
/**
* 随机颜色代码
* edit by www.jb200.com
*/
var obj = document.getElementsByTagName("span");
for(i=0;i<obj.length;i++)
{
var str = "0123456789abcdef";
var t = "#";
for(j=0;j<6;j++)
{t = t+ str.charAt(Math.random()*str.length);}
obj[i].style.color=t;
}
</script>
</head>
<body>
<span id=tag style="font-size:13px;">■■■■■</span> <span id=tag style="font-size:13px;">■■■■■</span>
<span id=tag style="font-size:13px;">■■■■■</span> <span id=tag style="font-size:13px;">■■■■■</span>
<span id=tag style="font-size:13px;">■■■■■</span> <span id=tag style="font-size:13px;">■■■■■</span>
<span id=tag style="font-size:13px;">■■■■■</span> <span id=tag style="font-size:13px;">■■■■■</span>
<span id=tag style="font-size:13px;">■■■■■</span> <span id=tag style="font-size:13px;">■■■■■</span>
<span id=tag style="font-size:13px;">■■■■■</span> <span id=tag style="font-size:13px;">■■■■■</span>
<span id=tag style="font-size:13px;">■■■■■</span> <span id=tag style="font-size:13px;">■■■■■</span>
<span id=tag style="font-size:13px;">■■■■■</span> <span id=tag style="font-size:13px;">■■■■■</span>
<span id=tag style="font-size:13px;">■■■■■</span> <span id=tag style="font-size:13px;">■■■■■</span>
<span id=tag style="font-size:13px;">■■■■■</span> <span id=tag style="font-size:13px;">■■■■■</span>
<span id=tag style="font-size:13px;">■■■■■</span> <span id=tag style="font-size:13px;">■■■■■</span>
</body>
</html>