先来看看效果图
实例代码
<! DocType html> <html> <head lang = "en"> <meta charset = "utf-8"> <title> </title> <style> #box {margin: 100px auto; Ancho: 200px; Altura: 150px; Línea de altura: 150px; espaciado de letras: 10px; Text-Align: Center; tamaño de fuente: 30px; Font-peso: más audaz; Border: 2px Palegreen sólido; Word-Wrap: Break-Word; Border-radio: 5px ;; Posición: relativo; } #Btn {posición: absoluto; Izquierda: 50%; Arriba: 280px; } </style> </head> <body> <div id = "box"> <span> 1 </span> <span> 2 </span> <span> 3 </span> <span> 4 </span> </div> <input type = "button" id = "btn" value = "我变了哟！"/> <script> // 提取标签 var box = document.getElementByid ("cero");; var span = document.getElementsBytagName ("span"); var btn = document.getElementById ("btn"); var color = ""; var str = "0123456789ABCDEF"; btn.onClick = functer () {for (var i = 0; i <span.length; i ++) {// 生成四位数 for (var j = 0; j <6; j ++) {// 随机改变每个数字的颜色 color+= str.substr (parseInt (math.random ()*str.length), 1); // 取颜色 (循环 每次提取一位 每次提取一位 进行拼接组成 进行拼接组成 6 为颜色的值) 为颜色的值) 为颜色的值) 为颜色的值) 为颜色的值) 为颜色的值) 为颜色的值) span [i] .innerhtml = parseInt (math.random ()*10); // 生成随机数 span [i] .style.color = ("#"+color); // 随机改变每个 span 的颜色 color = ""; }} </script> </body> </html>以上就是这篇文章的全部内容 ， 实现代码很简单 ， 希望对大家能有一定的帮助 如果有问题可以留言交流 小编会尽快给大家回复的。 小编会尽快给大家回复的。