Lassen Sie uns zuerst den Effekt sehen
Der Code ist wie folgt
<! DocType html> <html> <head> <meta charset = "utf-8"> <title> Random Tag-Cloud </title> <style type = "text/css">*{Margin: 0; Padding: 0} A {Textdekoration: Keine} #wrap {width: 400px; Rand: auto} </style> <script type = "text/javaScript"> window.onload = function () {var obox = document.getElementById ("Wrap"); var obj = obox.getElementsByTagName ("a"); // Random -Methode -Funktion Rand (num) {return parseInt (math.random ()*num+1); } // zufällige Farbwertfunktion RandomColor () {var str = math.ceil (math.random ()*16777215) .ToString (16); if (Str.Length <6) {str = "0"+str; } return str; } // Schleife für (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 = "Keine"; }}} </script> </head> <body> <div id = "Wrap"> <a href = "#"> Web Standard Learning </a> <a href = "#"> cs href="#">video</a> <a href="#">audio</a> <a href="#">jQuery</a> <a href="#">jQuery</a> <a href="#">jQuerymobile</a> <a href="#">flash</a> <a href="#">firefox</a> <a href = "#"> Chrome </a> <a href = "#"> Opera </a> <a href = "#"> ie9 </a> <a href = "#"> css3.0 </a> </a> </a> </a> </a>#"#">#">" href = "#"> href = "#"> google </a> <a href = "#"> Jobs </a> </div> </body> </html>Dieser Algorithmus ist relativ einfach (ich kann Orz verstehen ...), aber er implementiert im Grunde die Anforderungen
Das obige ist der gesamte Inhalt dieses Artikels. Weitere Informationen zu JavaScript finden Sie unter: "JavaScript Reference Tutorial" und "JavaScript Code Style Guide". Ich hoffe auch, dass jeder wulin.com mehr unterstützt.