HTML "link" (hoja de estilo) atributo disabled

estoy usando JavaScript para activar/desactivar las hojas de estilo utilizando la siguiente:HTML "link" (hoja de estilo) atributo disabled

document.styleSheets[0].disabled = true|false;

Este JS funciona bien, sin embargo me gustaría que la hoja de estilo para ser desactivado por defecto. Si bien podría utilizar el JS anterior para desactivar inmediatamente la hoja de estilos cuando se carga la página, esto obviamente no funcionará para los usuarios que tienen JavaScript desactivado.

He intentado hacer esto:

<link rel="stylesheet" href="style.css" disabled />

Mientras que esto desactiva la hoja de estilo, JavaScript (o, al menos, el método que estoy usando) No se puede habilitar de nuevo. También probé todas estas variaciones en el atributo "deshabilitado": disabled="disabled", disabled="true" y disabled=true, pero estas producen el mismo problema: no puedo habilitarlas de nuevo con JavaScript.

En resumen, necesito habilitar/deshabilitar una hoja de estilo externa usando JavaScript, pero tengo esa hoja de estilo deshabilitada por defecto pero sin depender de JavaScript.

Cualquier ayuda sería muy apreciada. Gracias.

N.B. Este efecto se puede lograr utilizando dos hojas de estilo, la segunda sobreescribiendo la primera, por lo tanto, no es necesario el atributo "deshabilitado". Sin embargo, es obviamente preferible usar solo una hoja de estilo si es posible, de ahí mi pregunta anterior.

Fuente

2012-05-12 VettelS

Puede utilizar el método de removeAttribute JavaScript para eso.

<html> 
    <head> 
     <link id="first_style" rel="stylesheet" href="#" disabled /> 

     <script type="text/javascript"> 
      window.onload = function() 
      { 
       document.getElementById('first_style').removeAttribute('disabled'); 
      } 
     </script> 
    </head> 
    <body> 
     <p>something</p> 
    </body> 
</html>

Fuente

2012-05-12 15:12:19

Gracias, esto es perfecto. No sé por qué nunca pensé en esto: puedo usar removeAttribute para deshabilitar y addAttribute para habilitar. – VettelS

Muy bienvenido, señor. Me alegro de estar a servicio y ... espera ... VettelS, ¿eres un fanático de las carreras? –

¡Por supuesto! Fan de los mejores =) – VettelS

Creo que en este caso es posible que deba confiar en JavaScript.

Si cree que más adelante en la entrega de la hoja de estilo si es necesario en lugar de deshabilitarla por defecto, debe clavarla.

Fuente

2012-05-12 15:08:13 HankChizlJaw

¿Por qué no se soluciona el problema: solo carga el CSS si JavaScript está habilitado?

Tomado de this example, podría utilizar algo como:

var fileref=document.createElement("link") 
fileref.setAttribute("rel", "stylesheet") 
fileref.setAttribute("type", "text/css") 
fileref.setAttribute("href", filename)

Fuente

2012-05-12 15:09:02

Si tuviera que usar esto, ¿me permitiría JavaScript habilitarlo/deshabilitarlo una vez que se cargue la hoja de estilo? – VettelS

Si echas un vistazo al enlace provisto, verás que también se explica cómo eliminar un archivo CSS a través de JavaScript. –

HTML "link" (hoja de estilo) atributo disabled

Respuesta

Cuestiones relacionadas