一句JS代码，实现随机颜色的生成
今天我们只用 一句JS代码，实现随机颜色的生成，首先看一下效果：
每次刷新浏览器背景颜色都不一样
实现此效果的JS函数 ：
let randomColor = () => ...: 定义一个箭头函数randomColor，用于生成一个随机颜色。Math.random(): 生成一个0到1之间的随机数。Math.random() * 0xffffff: 将这个随机数乘以0xffffff（即16777215，这是16进制表示的最大值），得到一个0到16777215之间的随机整数。Math.floor(...): 对上述结果进行向下取整，确保得到的是一个整数。.toString(16): 将这个整数转换为16进制字符串。`#${...}`: 将16进制字符串包裹在#符号中，形成CSS颜色代码的格式。
document.body.style.backgroundColor = randomColor(): 调用randomColor函数生成一个随机颜色，并将其设置为<body>元素的背景颜色。
实现原理
- 使用JavaScript的
Math.random()函数生成一个0到1之间的随机数。 - 将这个随机数乘以
0xffffff，得到一个0到16777215之间的随机整数。 - 使用
Math.floor()函数将结果向下取整，确保得到的是一个整数。 - 使用
.toString(16)方法将整数转换为16进制字符串。 - 将16进制字符串包裹在
#符号中，形成CSS颜色代码的格式。 - 将生成的随机颜色代码设置为
<body>元素的背景颜色。
完整代码：
<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>Document</title></head><body><script>// 定义一个函数，生成一个随机的颜色let randomColor = () =>`#${Math.floor(Math.random()*0xffffff).toString(16)}`// 将body的背景颜色设置为随机生成的颜色document.body.style.backgroundColor = randomColor()</script></body>
</html>
相关文章：
一句JS代码，实现随机颜色的生成
今天我们只用 一句JS代码，实现随机颜色的生成，首先看一下效果： 每次刷新浏览器背景颜色都不一样 实现此效果的JS函数 ： let randomColor () > ...: 定义一个箭头函数randomColor，用于生成一个随机颜色。 Math.ra…...
校园抢课助手【7】-抢课接口限流
在上一节中，该接口已经接受过风控的处理，过滤掉了机器人脚本请求，剩下都是人为的下单请求。为了防止用户短时间内高频率点击抢课链接，海量请求造成服务器过载，这里使用接口限流算法。 先介绍下几种常用的接口限流策略…...
char类型和int类型
一、char类型 在Java中，char（字符）类型用于表示单个字符，它是基本数据类型之一。以下是关于Java中char类型的一些重要信息： 表示方式： char类型用于存储Unicode字符，占用16位（即2个字…...
C++参悟：stl中的比较最大最小操作
stl中的比较最大最小操作 一、概述二、最小值1. min2. min_element 三、最大值1. max2. max_element 四、混合1. minmax2. minmax_element 一、概述 记录这里C11中常用的最小值和最大值的比较函数，最好的参考资料其实就是 https://zh.cppreference.com 最重要的查…...
JAVA读取netCdf文件并绘制热力图
读取netCdf的依赖 <dependency><groupId>ucar</groupId><artifactId>netcdfAll</artifactId><version>5.5.3</version><scope>system</scope><exclusions><exclusion><groupId>org.slf4j</groupId…...
数据结构——八大排序
一.排序的概念和其应用 1.1排序的概念 排序：排列或排序是将一组数据按照一定的规则或顺序重新组织的过程，数据既可以被组织成递增顺序（升序），或者递减顺序（降序）。稳定性：假定在待…...
【Unity】RPG2D龙城纷争（十九）流程与UI界面（终章）
更新日期：2024年8月1日。 项目源码：第五章发布（正式开始游戏逻辑的章节） 索引 简介一、游戏流程1.初始化流程2.开始流程3.关卡流程4.关卡结束流程5.启用所有流程二、UI界面逻辑1.开始界面2.存档界面3.关卡界面DataRegion 数据显示逻辑区域RoundRegion 回合逻辑区域RoleMenu…...
C#类和结构体的区别
1、类class是引用类型，多个引用类型变量的值会互相影响。存储在堆（heap）上 2、结构体struct是值类型，多个值类型变量的值不会互相影响。存储在栈（stack）上 类结构关键字classstruct类型引用类型值类型存储…...
【RabbitMQ】RabbitMQ持久化
一、简介 RabbitMQ的持久化机制是一种确保数据在RabbitMQ服务重启或异常情况下不会丢失的重要特性。RabbitMQ的持久化主要包括三个方面的内容：交换器的持久化、队列的持久化、消息的持久化。 二、交换器的持久化 1、实现方式 在RabbitMQ中，实现交换器…...
算法刷题笔记 Kruskal算法求最小生成树（详细算法介绍，详细注释C++代码实现）
文章目录 题目描述基本思路实现代码 题目描述 给定一个n个点m条边的无向图，图中可能存在重边和自环，边权可能为负数。求最小生成树的树边权重之和，如果最小生成树不存在则输出impossible。 最小生成树的概念：给定一张边带权的无向…...
5年经验的软件测试人员，碰到这样的面试题居然会心虚......
我们这边最近的面试机会比较多，但是根据他们的反馈，结束后大部分都没音信了，因为现在企业面试问的非常多，范围非常广，而且开放性的问题很多，很多人即便面试前刷了成百上千道面试题，也很难碰到一…...
C#进阶-轻量级ORM框架Dapper的使用教程与原理详解
本文详细介绍了Dapper在C#中的使用方法，包括Dapper的基本概念、与其他持久层框架的比较、基本语法和高级语法的使用，并通过实例讲解了如何在项目中集成和使用Dapper。Dapper以其高效的性能和简洁的API受到开发者的青睐，适用于各种数据库操作需…...
-MFC-C/C++ - 编辑框(Edit Control) - CEdit)
Windows图形界面(GUI)-MFC-C/C++ - 编辑框(Edit Control) - CEdit
公开视频 -> 链接点击跳转公开课程博客首页 -> 链接点击跳转博客主页 目录 编辑框(Edit Control) - CEdit 基本概念 成员函数 示例代码 编辑框(Edit Control) - CEdit 基本概念 编辑框（Edit Control）是一个允许用户输入和编辑文本的窗…...
网络安全防御【IPsec VPN搭建】
目录 一、实验拓扑图 二、实验要求 三、实验思路 四、实验步骤： 修改双机热备的为主备模式： 2、配置交换机LSW6新增的配置： 3、防火墙（FW4）做相关的基础配置： 4、搭建IPsec VPN通道 （1…...
java环境配置与tomcat的配置
1、java环境配置 一、JDK下载 访问Oracle官网： 前往Oracle官网（Oracle | Cloud Applications and Cloud Platform），在首页的顶部菜单中选择“Resources” > “Downloads” > “Java” > “JDK”。注意：Orac…...
OD C卷 - 来自异国的客人/幸运数字
来自异国的客人/幸运数字（100） 输入描述： 输入k,n,m k表示物品价值（十进制） k>0 n表示幸运数字, n > 0 m表示异国采用的进制；m > 1 n < m 输出描述： 输出幸运数字的个数࿰…...
C++ | 动态内存管理 new、delete (用法、底层)详解
目录 简单回顾C语言动态内存管理 new、delete的用法 内置类型 new delete 自定义类型 new、delete底层讲解（重要） operator new 与 operator delete 定位 new 结语 简单回顾C语言动态内存管理 在C语言的学习阶段 我们接触到了三个能在堆上开辟…...
【C语言】结构体内存布局解析——字节对齐
🦄个人主页:小米里的大麦-CSDN博客 🎏所属专栏:https://blog.csdn.net/huangcancan666/category_12718530.html 🎁代码托管:黄灿灿 (huang-cancan-xbc) - Gitee.com ⚙️操作环境:Visual Studio 2022 目录 一、引言 二、什么是字节对齐&…...
模型表达方式
目录 一、模型表达概述 二、模型精确表达 2.1 几何表示 (Geometrical Representation) 三、模型非精确表达 3.1 网格表示 (Mesh Representation) 3.2 体素表示 (Voxel Representation) 一、模型表达概述 模型的表达方式多种多样，选择适合的表达方式取决于具体应用场景和…...
校园课程助手【4】-使用Elasticsearch实现课程检索
本节将介绍本项目的查询模块，使用Elasticsearch又不是查询接口，具体流程如图所示（如果不了解Elasticsearch可以使用sql语句进行查询）： 这里是两种方法的异同点： Mysql：擅长事务类型操作&#…...
Appium+python自动化（十六）- ADB命令
简介 Android 调试桥(adb)是多种用途的工具，该工具可以帮助你你管理设备或模拟器 的状态。 adb ( Android Debug Bridge)是一个通用命令行工具，其允许您与模拟器实例或连接的 Android 设备进行通信。它可为各种设备操作提供便利，如安装和调试…...
2025年能源电力系统与流体力学国际会议 (EPSFD 2025)
2025年能源电力系统与流体力学国际会议（EPSFD 2025）将于本年度在美丽的杭州盛大召开。作为全球能源、电力系统以及流体力学领域的顶级盛会，EPSFD 2025旨在为来自世界各地的科学家、工程师和研究人员提供一个展示最新研究成果、分享实践经验及…...
Java 8 Stream API 入门到实践详解
一、告别 for 循环！ 传统痛点： Java 8 之前，集合操作离不开冗长的 for 循环和匿名类。例如，过滤列表中的偶数： List<Integer> list Arrays.asList(1, 2, 3, 4, 5); List<Integer> evens new ArrayList…...
QMC5883L的驱动
简介 本篇文章的代码已经上传到了github上面，开源代码 作为一个电子罗盘模块，我们可以通过I2C从中获取偏航角yaw，相对于六轴陀螺仪的yaw，qmc5883l几乎不会零飘并且成本较低。 参考资料 QMC5883L磁场传感器驱动 QMC5883L磁力计…...
【数据分析】R版IntelliGenes用于生物标志物发现的可解释机器学习
禁止商业或二改转载，仅供自学使用，侵权必究，如需截取部分内容请后台联系作者! 文章目录 介绍流程步骤1. 输入数据2. 特征选择3. 模型训练4. I-Genes 评分计算5. 输出结果 IntelliGenesR 安装包1. 特征选择2. 模型训练和评估3. I-Genes 评分计…...
2025年渗透测试面试题总结-腾讯[实习]科恩实验室-安全工程师（题目+回答）
安全领域各种资源，学习文档，以及工具分享、前沿信息分享、POC、EXP分享。不定期分享各种好玩的项目及好用的工具，欢迎关注。 目录 腾讯[实习]科恩实验室-安全工程师 一、网络与协议 1. TCP三次握手 2. SYN扫描原理 3. HTTPS证书机制 二…...
免费数学几何作图web平台
光锐软件免费数学工具，maths,数学制图，数学作图，几何作图，几何，AR开发,AR教育,增强现实,软件公司,XR,MR,VR,虚拟仿真,虚拟现实,混合现实,教育科技产品,职业模拟培训,高保真VR场景,结构互动课件,元宇宙http://xaglare.c…...
消防一体化安全管控平台：构建消防“一张图”和APP统一管理
在城市的某个角落，一场突如其来的火灾打破了平静。熊熊烈火迅速蔓延，滚滚浓烟弥漫开来，周围群众的生命财产安全受到严重威胁。就在这千钧一发之际，消防救援队伍迅速行动，而豪越科技消防一体化安全管控平台构建的消防“…...
用鸿蒙HarmonyOS5实现国际象棋小游戏的过程
下面是一个基于鸿蒙OS (HarmonyOS) 的国际象棋小游戏的完整实现代码，使用Java语言和鸿蒙的Ability框架。 1. 项目结构 /src/main/java/com/example/chess/├── MainAbilitySlice.java // 主界面逻辑├── ChessView.java // 游戏视图和逻辑├── …...
使用python进行图像处理—图像滤波（5）
图像滤波是图像处理中最基本和最重要的操作之一。它的目的是在空间域上修改图像的像素值，以达到平滑（去噪）、锐化、边缘检测等效果。滤波通常通过卷积操作实现。 5.1卷积(Convolution)原理 卷积是滤波的核心。它是一种数学运算，…...