怎样用js实现为一段HTML元素设置随机颜色字体（亲测可用）

最新推荐文章于 2025-07-03 19:33:04 发布

原创最新推荐文章于 2025-07-03 19:33:04 发布 · 4.8k 阅读

5 ·

CC 4.0 BY-SA版权

文章标签：

#js #随机颜色

JavaScript 同时被 2 个专栏收录

41 篇文章

订阅专栏

前端开发

36 篇文章

订阅专栏

本文介绍如何利用JavaScript实现HTML元素的字体颜色随机变化。通过JS代码，可以为指定的HTML元素动态地赋予不同的随机颜色，增强页面交互体验。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

用JS为一段HTML元素设置随机颜色字体

HTML中的元素

<p id='broadcast'>testtest</p>

JS部分

var chars = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'A', 'B', 'C', 'D', 'E', 'F'];

function generateMixed(n) {
    var res = "";
    for (var i = 0; i < n; i++) {
        var id = Math.ceil(Math.random() * 16);
        res += chars[id];
    }
    return res;
}

var num = generateMixed(6);
var p = document.getElementById('broadcast');
p.style.color = "#" + num;