Js定义CSS还有这样的写法?

2008-3-30  14:30

          高科技,无人驾驶!写程序的人估计都知道一句话:"没有最牛,只有更牛!",有时候你花了一大篇写的东西,人家几行代码就搞定了,而且效率还是你的几倍,佩服吧!今天在BlueIdea上看到这段代码,才知道原来还有这种高级的写法!

 

XML/HTML代码
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  2. <html xmlns="http://www.w3.org/1999/xhtml">  
  3. <head>  
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
  5. <style type="text/css">  
  6. *{margin:0px; padding:0px;}   
  7. </style>  
  8. <script type="text/javascript"></script>  
  9. <title>test</title>  
  10. </head>  
  11. <body>  
  12. <p>ddddddddddddddddd</p>  
  13. <div>sdfsdfsd<br/></div>  
  14.     <div class="drag" >  
  15.     <h1>测试一</h1>  
  16.     </div>  
  17.     <div class="drag" >  
  18.     <h1>测试一</h1>  
  19.     </div>  
  20.     <div class="drag" >  
  21.     <h1>测试一</h1>  
  22.     </div>  
  23.     <div class="drag"><h1>测试二</h1></div>  
  24.     <div class="drag"><h1>测试三</h1></div>  
  25.     <div class="drag"><h1>测试四</h1></div>  
  26.     <div class="drag"><h1>测试五</h1></div>  
  27. </body>  
  28. </html>  
  29. <script type="text/javascript">  
  30. var s=document.body.getElementsByTagName("*");   
  31. //alert(s[2].innerHTML)   
  32. var tempDiv=document.createElement("div");   
  33. with(tempDiv.style){   
  34.     display="none";   
  35.     position="absolute";   
  36.     lineHeight="20px";   
  37.     padding="5px";   
  38.     border="1px solid red"  
  39. }   
  40. document.body.appendChild(tempDiv);   
  41. for(var i=0;i<s.length;i++){   
  42.  s[i].onmouseover=function(){   
  43.   tempDiv.style.left=this.offsetX||this.offsetLeft+20;   
  44.   tempDiv.style.top=this.offsetY||this.offsetTop+30;   
  45.   tempDiv.style.display="block";   
  46.   tempDiv.innerHTML=this.innerHTML;   
  47.  }   
  48.  s[i].onmouseout=function(){   
  49.     
  50.    tempDiv.style.display="none";   
  51.    tempDiv.innerHTML="";   
  52.  }   
  53. }   
  54. </script>  

     看看上面定义CSS那段的with写法,太省事了,爽!

发表评论