Veamos el efecto primero
El código es el siguiente
<! DocType html> <html> <head> <meta charset = "utf-8"> <title> nube de etiqueta aleatoria </title> <style type = "text/css">*{margin: 0; Padding: 0} a {Text-Decoration: None} #Wrap {Width: 400px; margen: auto} </style> <script type = "text/javascript"> window.onload = function () {var obox = document.getElementById ("wrap"); var obj = obox.getElementsBytagName ("A"); // función de método aleatorio rand (num) {return parseInt (math.random ()*num+1); } // función de valor de color aleatorio randomColor () {var str = math.ceil (math.random ()*16777215) .ToString (16); if (str.length <6) {str = "0"+str; } return str; } // bucle para (len = obj.length, i = len; i-;) {obj [i] .classname = "color"+rand (5); obj [i] .style.zindex = rand (5); obj [i] .style.fontSize = rand (12) +12+ "Px"; // obj [i] .style.background = "#"+randomColor (); obj [i] .style.color = "#"+randomColor (); obj [i] .onmouseover = function () {this.style.background = "#"+randomColor (); } obj [i] .onMouseOut = function () {this.style.background = "Ninguno"; }}}} </script> </fead> <body> <div id = "wrap"> <a href = "#"> Web Standard Learning </a> <a href = "#"> css </a> <a href = "#"> javaScript </a> <a href = "#"> html5 </a> <a href = "#"#" href = "#"> video </a> <a href = "#"> audio </a> <a href = "#"> jQuery </a> <a href = "#"> jQuery </a> <a href = "#"> jQueryMobile </a> <a href = "#"> href = "#"> Chrome </a> <a href = "#"> ópera </a> <a href = "#"> ie9 </a> <a href = "#"> css3.0 </a> <a href = "#"> andRiod </a> <a href = "#"> manzana </a> <a href = "#"#" href = "#"> href = "#"> Google </a> <a href = "#"> Jobs </a> </div> </body> </html>Este algoritmo es relativamente simple (puedo entender a Orz ...), pero básicamente implementa los requisitos
Lo anterior es todo el contenido de este artículo. Para obtener más información sobre JavaScript, puede consultar: "Tutorial de referencia de JavaScript" y "Guía de estilo de código JavaScript". También espero que todos apoyen más a Wulin.com.