先来看看效果图
实例代码
<! Doctype html> <html> <head lang = "en"> <meta charset = "utf-8"> <ititle> </ title> <style> #box {margin: 100px auto; Largeur: 200px; hauteur: 150px; HEURS DE LIGNE: 150px; Espacement des lettres: 10px; Texte-aligne: Centre; taille de police: 30px; Police-poids: plus audacieux; Border: 2px Palegreen solide; Word-Wrap: Break-Word; Border-Radius: 5px ;; Position: relative; } #btn {position: absolue; Gauche: 50%; En haut: 280px; } </ style> </ head> <body> <div id = "box"> <span> 1 </span> <span> 2 </span> <span> 3 </span> <span> 4 </span> </v> <entrée type = "Button" id = "btn" value = "我变了哟！" /> <cript> // 提取标签 var box = document.getelement ("box"); var span = document.getElementsByTagName ("Span"); var btn = document.getElementById ("btn"); var color = ""; var str = "0123456789abcdef"; btn.onclick = function () {for (var i = 0; i <span.length; i ++) {// 生成四位数 pour (var j = 0; j <6; j ++) {// 随机改变每个数字的颜色 Color + = str.sustr (parseInt (math.random () * str.length), 1); // 取颜色 (循环 ， ， 每次提取一位 ， ， 进行拼接组成 进行拼接组成) Span [i] .InnerHtml = paSeInt (math.random () * 10); // 生成随机数 span [i] .style.color = ("#" + couleur); // 随机改变每个 span 的颜色 colore = ""; }} </ script> </ body> </html>以上就是这篇文章的全部内容 ， 实现代码很简单 ， 希望对大家能有一定的帮助 ， 如果有问题可以留言交流 ， 小编会尽快给大家回复的。