Advanced Search

Return to Snippet

Revision: 62386
at February 20, 2013 19:01 by agarcim
Initial Code 
function getCSSRule(ruleName, deleteFlag) {
  if (document.styleSheets) {
    for (var i=0; i<document.styleSheets.length; i++) {
      var styleSheet=document.styleSheets[i];
      var ii=0;
      var cssRule=false;
      do {
        if (styleSheet.cssRules) {
          cssRule = styleSheet.cssRules[ii];
        } else {
          cssRule = styleSheet.rules[ii];
        }
        if (cssRule)  {
          if (cssRule.selectorText==ruleName) {
            if (deleteFlag=='delete') {
              if (styleSheet.cssRules) {
                styleSheet.deleteRule(ii);
              } else {
                styleSheet.removeRule(ii);
              }
              return true;
            } else {
              return cssRule;
            }
          }
        }
        ii++;
      } while (cssRule)
    }
  }
  return false;
}

function killCSSRule(ruleName) {
  return getCSSRule(ruleName,'delete');
}

function addCSSRule(ruleName) {
  if (document.styleSheets) {
    if (!getCSSRule(ruleName)) {
      if (document.styleSheets[0].addRule) {
        document.styleSheets[0].addRule(ruleName, null,0);
      } else {
        document.styleSheets[0].insertRule(ruleName+' { }', 0);
      }
    }
  }
  return getCSSRule(ruleName);
}
Uso: 
// devuelve el objeto para la clase "fancyStyle"
fancyStyleObject=getCSSRule('fancyStyle');
// aplica la propiedad underline a la decoraci���³n del texto del objeto anterior
fancyStyleObject.style.textDecoration='underline'

// Elimina la clase "fancyStyle" eliminado los estilos aplicados al objeto.
killCSSRule('fancyStyle');

// Crea un nueva regla stylesheet para los parrafos.
newStyle=addCSSRule('p');
// Cambia todos los parrafos anteriores al color azul.
newStyle.style.color='blue';

// Creamos una nueva CSS class llamada fancyStyle.
newStyle=addCSSRule('.fancyStyle');
// Aplicamos un fondo verde a todos los elementos con la clase fancyStyle.
newStyle.backgroundColor='green';
Initial URL 
http://www.anieto2k.com/2007/03/09/10-utilidades-javascript-que-deberias-conocer/
Initial Description 
Functions to add, get y remove CSS rules
Initial Title 
Get, add y remove CSS rules
Initial Tags 
css, javascript
Initial Language 
JavaScript