<script type="text/javascript" src="js/jquery-1.5.1.min.js"></script> <script type="text/javascript"> $(function(){ var config = { renderTo : "foo" , tags : [ "JQuery","Prototype","ExtJS","Dojo","Yahoo-YUI","MooTools", "Script.Aculo.Us","MochiKit","Rialto","Spry Framework","QooXdoo","Zepo" ] } ; TagBOX.load(config) ; }) ; var TagBOX = function(){ function load(config){ var renderTo = $(document.getElementById(config.renderTo)) ; var tags = config.tags ; _render(renderTo,tags) ; } ; function _render(renderTo,tags){ var tagBox = $("<div></div>") .addClass("tag-box") .appendTo(renderTo) ; var close = $("<div></div>") .addClass("close") .appendTo(tagBox) ; var _a = $("<a href='#'></a>") .html("打开/关闭") .appendTo(close) .click(function(){ var jq = $(this).parent().next().slideToggle() ; }) ; var _ul = $("<ul></ul>").appendTo(tagBox) ; for(var i=0;i<tags.length;i++){ var tag = tags[i] ; var _css = _getStyle() ; var _li = $("<li></li>").appendTo(_ul) ; var _a_ = $("<a href=''></a>") .html(tag) .css( { color : _css.color , fontSize : _css.size } ) .appendTo(_li) ; } } ; function _getStyle(){ var sizes = ["11","12","13","14","15","16","18"] ; var colors = ["#000","#ff0033","#336699","brown","green","puple","#ffcc00"] ; var _style = new Object() ; _style.color = colors[parseInt(Math.random() * colors.length)] ; _style.size = parseInt(sizes[parseInt(Math.random() * sizes.length)]) ; return _style ; } ; return { load : load } ; }() ; </script>
?