通过JavaScript添加样式类_未分类的问答_编程通用

我如何通过javascript指定一个CSS类

回答

评论会员：游客时间：2012/02/04

Prerak帕特尔
]

评论会员：jsc42 时间：2012/02/04

如果有没有现成的类元素的SO页的第一个选项是不正确的。此外，还有一个简单的删除，追加，以取代在一些浏览器中的一个类名（如MS-IE6中）的CSS问题，是为了依赖（如h1.classA.classB是不作为h1.classB.classA）。

我用类似的代码（易拉罐）:

function trimAndCondenseSpaces(str)

{

   return str.replace(/^\s+/, '').replace(/\s+$/, '').replace(/\s{2,}/, ' ');

}   // trimAndCondenseSpaces



function getElement(elementOrId)   // Arg is element id or DOM node. Result is DOM node

{

   return (

            typeof elementOrId == 'string' 

            ? document.getElementById(elementOrId) 

            : elementOrId

          );

}   // getElement



function hasClass(elementOrId, className)   // Returns: true if class present, false if absent

{

 

   // Class name is surrounded by whitespace unless it is the first / last

   var el = getElement(elementOrId); 

   return (new RegExp('(^|\\s)' + className + '(\\s|$)')).test(el.className);

}   // hasClass



function addClass(elementOrId, className)

{

   // Get the element from its id or use the supplied DOM node

   var el = getElement(elementOrId); 

   if (! hasClass(el, className))

      el.className = 

         el.className == ''

         ? el.className + ' ' + className

         : className;

}   // addClass



function dropClass(elementOrId, className)

{

   var el = getElement(elementOrId); 

   if (hasClass(el, className))

      el.className = 

         trimAndCondenseSpaces(

            el.className

               .replace(new RegExp('(^|\\s)' + className + '(\\s|$)'), ' ')

            ); 

}   // dropClass



function replaceClass(elementById, oldClassName, newClassName)   / Adds if old class not found

{

   var el = getElement(elementById);

   el.className = 

      hasClass(el, oldClassName)

      ? trimAndCondenseSpaces(

         el.className

             .replace(new RegExp('(^|\\s)' + oldClassName + '(\\s|$)'), ' ' + newClassName + ' ')

         )

      : addClass(newClassName); 

}   // replaceClass