disabled = true se puede configurar dinámicamente en <style>. ¿Por qué no estáticamente?

Para deshabilitar los bloques <style>, todos los navegadores permiten configurar document.styleSheets[x].disabled = true. Sin embargo, solo IE permite que esta propiedad se establezca en la propia etiqueta, <style disabled="true">. ¿Hay alguna solución para esto en otros navegadores? Parece extraño que algo hecho dinámicamente no pueda hacerse también estáticamente.disabled = true se puede configurar dinámicamente en <style>. ¿Por qué no estáticamente?

Fuente

2011-04-22 Lucent

Se piensa 'true' podría ser un valor no válido del atributo' disabled'. Pruebe 'disabled =" disabled "' –

Agregue un evento onload en la etiqueta de estilo: '' onload = "this.disabled = true" '' –

Para hacerlo estáticamente, simplemente quite la etiqueta de estilo.

Como alternativa, puede eliminar el nodo de estilo del DOM y volver a insertarlo para volver a habilitarlo.

Fuente

2011-04-22 15:54:55 cdeszaq

¿Y si quiere agregarlo dinámicamente más tarde? –

@Peter of the Corn, pero entonces ya no es estático ¿verdad? – cdeszaq

Estoy seguro de que el caso de uso aquí es comenzar con los estilos estáticos desactivados, pero tenerlos disponibles para habilitarlos dinámicamente más adelante. –

El elemento style no tiene un atributo válido denominado disabled. De the HTML spec:

<!ELEMENT STYLE - - %StyleSheet  -- style info --> 
<!ATTLIST STYLE 
    %i18n;        -- lang, dir, for use with title -- 
    type  %ContentType; #REQUIRED -- content type of style language -- 
    media  %MediaDesc; #IMPLIED -- designed for use with these media -- 
    title  %Text;   #IMPLIED -- advisory title -- 
    >

Sin embargo, la interfaz DOM HTMLStyleElement sí tiene tal propiedad. De the DOM spec:

interface HTMLStyleElement : HTMLElement { 
      attribute boolean   disabled; 
      attribute DOMString  media; 
      attribute DOMString  type; 
};

No se debe confundir un elemento HTML con su contraparte en el DOM. No es "es extraño que algo hecho dinámicamente no se pueda hacer de forma estática". Las especificaciones HTML y DOM se crearon para resolver diferentes problemas. HTML es un lenguaje de marcado. DOM es una convención para representar e interactuar con los objetos en un documento.

Fuente

2011-04-22 16:00:18

¿Entonces no hay solución? IE hace lo razonable mientras todos los demás siguen ciegamente el estándar. – Lucent

@Lucent - No estoy de acuerdo con su caracterización. IE innecesariamente se desvía del estándar, mientras que todos los demás hacen lo que es razonable (es decir, sigue el estándar donde no hay una razón obvia y convincente para no hacerlo). El DOM y HTML son cosas separadas. No debe combinar sus respectivos estándares. Es * no * "extraño que algo hecho de forma dinámica tampoco se pueda hacer de forma estática", porque estos son estándares diferentes con diferentes propósitos. –

@Lucent - en realidad no. Principalmente funciona al revés, ya que el estándar registra ya sea lo que los navegadores ya hacen, o lo que han indicado que están dispuestos a hacer.Lo que están dispuestos a hacer es lo que creen que hay una demanda de los usuarios: son los usuarios los que proporcionan su flujo de ingresos. Eso, a su vez, depende de que los usuarios puedan usar las páginas web creadas por los autores web, y en este caso, simplemente no hay suficiente demanda por parte de los usuarios o autores para tener esta característica, por delante de otras cosas que podrían estar implementando. – Alohci

Una opción simple es convertirlo en una hoja de estilo alternativa con un título diferente al del conjunto de hojas de estilo principal. Eso hará que los navegadores lo deshabiliten por defecto.

Fuente

2011-04-22 18:28:24

Sería bueno si los ejemplos en [CSSOM sección 5.2.5] (http://dev.w3.org/csswg/cssom/#examples) incluyeran un uso del elemento de estilo – Alohci

El atributo media se puede establecer tanto en HTML como en Javascript. La idea es establecer el atributo media para que la etiqueta de estilo no se aplique a ningún dispositivo para deshabilitarla.

Creo que configurarlo como algo no válido como media="bogus" o media="none" es arriesgado ya que el navegador puede decidir simplemente ignorar el predicado y aplicar el estilo a todos los tipos de medios. Afortunadamente, establecer un ancho de pantalla máximo de un píxel es bastante válido y en mi libro es más o menos lo mismo que deshabilitar la etiqueta de estilo.

var style = document.querySelector("#my-style"); 
 

 
document.querySelector("#btn-style").addEventListener("click",function() { 
 
    style.removeAttribute("media"); 
 
}); 
 

 
document.querySelector("#btn-unstyle").addEventListener("click",function() { 
 
    style.setAttribute("media", "max-width: 1px"); 
 
});

<style id="my-style" media="max-width: 1px"> 
 
    p { color: red } 
 
</style> 
 

 
<p>Styled if you click below.</p> 
 

 
<button id="btn-style">Style that p</button> 
 

 
<button id="btn-unstyle">Unstyle that p</button>

Fuente

2018-02-01 16:54:58

disabled = true se puede configurar dinámicamente en <style>. ¿Por qué no estáticamente?

Respuesta

Cuestiones relacionadas