<img src="http://files.jb51.net/upload/2009-12/20091226022816543.gif" border="0" alt="javascript 깜박이는 크리스마스 트리 구현 code_javascript 기술" ><br><div class="htmlarea"> <textarea id="runcode41881"> <title>크리스트리</title> </textarea> <br><input onclick="runEx('runcode41881')" type="button" value="运行代码"><input onclick="doCopy('runcode41881')" type="button" value="复制代码"> <input onclick="doSave(runcode41881)" type="button" value="保存代码"> <a href="http://www.jb51.net/article/23421.htm" title="查看具体详情" target="_blank">[Ctrl A 모두 선택 참고: </a>외부 J를 도입해야 하는 경우 실행하려면 새로 고쳐야 합니다 </div>]<script type="text/javascript"> var $ = function(){ var dom = {}; return { get : function($){ if(!dom[$]) dom[$] = document.getElementById($); return dom[$]; } ,apply : function(s,t,d){ if(t && typeof t == 'object') $.apply(s,d) if(s && t && typeof s == 'object' && typeof t == 'object'){ for(var i in t){s[i] = t[i]} } return s; } ,createEl : function(attribute,tag){ if(!tag) tag = "DIV"; var el = document.createElement(tag); $.apply(el,attribute); return el; } } }() var chrisTree = function(params){ $.apply(this.param,params || {}) this.__construct(); } chrisTree.prototype = { param : {} ,__construct : function(){ var x = this.param.x,y = this.param.y,xy=[]; for(var i=0;i<7;i++){ xy = this.createTree(x,y,i/4) x = xy[0]; y = xy[1]; } this.createRoot(x,y,xy[2]); } ,createTree : function(x,y,level){ var lel = level || 0.1 for(i=0;i<110*lel;i+=10){ for(j=i-10;j<2*i;j+=10){ var el = $.createEl({ id : "div_"+x+"_"+i+"_"+y+"_"+j },"span"); el.style.cssText = "width:5px;height:5px;position:absolute;left:"+(x - i*3/2 + j)+";top:"+(y+i)+";font-size:0px;background:#00ff00"; document.body.appendChild(el); if(j == i-10) this.lightUp(el.id,x - i*3/2 + j,y+i); } this.lightUp(el.id,x - i*3/2 + j,y+i); } return [this.param.x,this.param.y+110*lel,y+i] } ,createRoot : function(x,y,l){ for(var i = 0;i<50;i++){ var el = $.createEl({ id : "div_"+x+"_"+i+"_"+y+"_"+j },"span"); el.style.cssText = "width:5px;height:5px;position:absolute;left:"+x+";top:"+(l+i)+";font-size:0px;background:#fff"; document.body.appendChild(el); } } ,createText : function(text){ var el = $.createEl({ id : "text" ,innerHTML : text ,align:'center' }) el.style.cssText = "color:#fff;background:#fff:margin:4px;padding:3px;top:500px;left:500;font-size:20px;position:absolute"; document.body.appendChild(el); } ,lightUp : function(id,x,y){ var self = this,i=0; setTimeout(function(){ i++; $.get(id).style.background = self.lightColor[i%self.lightColor.length]; setTimeout(arguments.callee,200); },this.param.howToShine(x,y)) } ,lightColor : ['#ff0000',"#00ff00","#ffff00","#ff6600","#66ff00"] } new chrisTree({ x : 400 ,y : 50 ,howToShine : function(x,y){return 100+x-y} }) new chrisTree({ x : 600 ,y : 50 ,howToShine : function(x,y){return Math.sqrt(x*x-2*x*y+y*y)*10} }) var ct = new chrisTree({ x : 800 ,y : 50 ,howToShine : function(x,y){return x+y} });ct.createText('Merry chrismas!:)))))'); </script>
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
