先来看看效果图
实例代码
<! DocType html> <html> <head Lang = "en"> <meta charset = "utf-8"> <titels> </title> <style> #box {Margin: 100px Auto; Breite: 200px; Höhe: 150px; Zeilenhöhe: 150px; Buchstabenabteilung: 10px; Text-Align: Mitte; Schriftgröße: 30px; Schriftgewicht: mutiger; Grenze: 2px solide Palegreen; WORT-WRAP: Breakwort; Border-Radius: 5px ;; Position: Relativ; } #btn {Position: absolut; Links: 50%; Oben: 280px; } </style> </head> <body> <div id = "box"> <span> 1 </span> <span> 2 </span> <span> 3 </span> <span> 4 </span> </div> <Eingabe type = "button" id = "btn" value = "我变了哟！"/> <Script> // 提取标签 var box = document.document.docinement. "boxement (" box ("box (" box ("box (" box (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++){//生成四位数 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>以上就是这篇文章的全部内容 ， 实现代码很简单 ， 希望对大家能有一定的帮助 ， 如果有问题可以留言交流 ， 小编会尽快给大家回复的。 小编会尽快给大家回复的。 小编会尽快给大家回复的。