JS实现随机颜色生成脚本
作者：微光时间：2026-10-22 04:01:00浏览：125
本文介绍一个仅237字节的JavaScript脚本，用于为页面中的span元素生成随机十六进制颜色值。通过遍历DOM节点并修改style.color属性，实现标签页或任意页面的随机色彩效果。代码可直接嵌入ASP或JS文件中，适用于需要简单视觉变化的场景。
JS实现随机颜色生成脚本
应部分用户需求，现提供一个轻量级的JavaScript解决方案。该脚本体积仅为237字节，非常精简。使用方法十分简单：将下方提供的代码片段插入到tag.asp文件中<div id="mainContent-bottomimg">标签之前即可生效。若希望简化交互，无需提出额外疑问。此外，该代码也可放置于header.asp或footer.asp中，但需注意，这样做会导致整个页面所有span元素均应用随机颜色效果。演示地址为http://www.hljsh.com/tag.asp，虽然该演示由ASP实现，但效果与本文提供的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><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> [Ctrl+A 全选 注:引入外部Js需再刷新一下页面才能执行]
作者最新文章
JavaScript零基础入门：从环境搭建到运行第一段代码
2026-11-05 15:29:58
HTML链接中javascript：void(0)的作用及现代替代方案
2026-11-05 10:07:47
在线调试 JS 时怎么引入 jQuery 或 Vue 等第三方库
2026-11-05 08:53:56
原生JavaScript实现简易颜色选择器原理与代码
2026-11-03 23:22:19
JS原生表单序列化：FormData与URLSearchParams用法详解
2026-11-03 23:13:21