Me gustaría cargar un documento usando fetch() y luego aplicarle estilos CSS.
Sin embargo, no parece que pueda inspeccionar los estilos a menos que agregue el documento al principal, como se ve aquí:
const doc = fetch(); // get some document doc.documentElement.computedStyleMap() // returns an empty map document.appendChild(doc.documentElement) // attach it to the main document object doc.documentElement.computedStyleMap() // now populated¿Hay alguna manera de que pueda llamar a algún método para que ocurra la cascada de CSS, completando el mapa de estilo calculado sin adjuntarlo como se hizo en el paso 3?
Me gustaría cargar un documento usando fetch() y luego aplicarle estilos CSS.
Probé esto localmente y parece que computedStyleMap solo funciona para documentos/elementos que realmente están adjuntos en el DOM .
Una alternativa es usar la API de hojas de estilo.
var styleSheet = document.styleSheets[0]; styleSheet.insertRule('.myclass{ color: 'red'; }', styleSheet.cssRules.length); Tenga en cuenta que si carga una hoja de estilo de otro dominio, como un CDN, es posible que deba seleccionar un índice diferente de .styleSheets para usar uno en su dominio. De lo contrario, puede encontrar errores de seguridad.