首页 - 文章 - Javascript - Javascript教程

用 Javascript 实现检测、添加、移除样式（className）

作者: CodeBit.cn     来源: CodeBit.cn     时间: 2008-07-21 22:47:05
摘要: 在前台脚本中，我们经常要操作页面元素的样式，比如标签页切换时，将当前标签加上一个样式，当切换到其他标签时，再将样式还原，本文介绍的是直接添加和移除 className 的方法。
归类: Javascript, (X)HTML/CSS,

关键词: 删除样式, hasClass, 检测样式, addClass, 增加样式, removeClass,


在前台脚本中，我们经常要操作页面元素的样式，比如标签页切换时，将当前标签加上一个样式，当切换到其他标签时，再将样式还原，本文介绍的是直接添加和移除 className 的方法。


Javascript:
  1.  
  2. <script type="text/javascript"> 
  3.  
  4. // 说明：添加、移除、检测 className 
  5. // 整理：CodeBit.cn ( http://www.codebit.cn ) 
  6.  
  7. function hasClass(element, className) { 
  8.     var reg = new RegExp('(\\s|^)'+className+'(\\s|$)'); 
  9.     return element.className.match(reg); 
  10. } 
  11.  
  12. function addClass(element, className) { 
  13.     if (!this.hasClass(element, className)) 
  14.     { 
  15.         element.className += " "+className; 
  16.     } 
  17. } 
  18.  
  19. function removeClass(element, className) { 
  20.     if (hasClass(element, className)) { 
  21.         var reg = new RegExp('(\\s|^)'+className+'(\\s|$)'); 
  22.         element.className = element.className.replace(reg,' '); 
  23.     } 
  24. } 
  25.  
  26. </script> 
  27.  




相关文章
  • 暂无相关文章
发表评论 有想法？点此发表评论？
推荐链接：(联系 QQ ：326801485)