Encontré esto en la web.
function largeFont() { const dStyle = document.querySelector('style'); dStyle.innerHTML = 'p {font-size: 2rem;}'; } Pero esto toma todo lo que hay dentro de <style></style> , lo limpia y pone "p {font-size: 2rem;}". ¿Es posible cambiar algo específico dentro de <style></style> como
document.querySelector('style').body or document.querySelector('style').#box document.querySelector('style').box.background-colorO lo que sea. Sé cómo hacerlo en línea, pero preferiría no hacerlo en este caso. Quiero decir, supongo que podría analizar todo y encontrar reemplazar ese texto...
Si el estilo está en línea en la página, puede insertar contenido en él con += , lo que mantendrá el contenido existente.
const dStyle = document.querySelector('style'); dStyle.innerHTML += 'p {font-size: 2rem;}'; // ^^^ Si el estilo no está en línea en la página, o no desea utilizar el enfoque anterior, también puede utilizar insertRule .
const sheet = document.querySelector('style').sheet; sheet.insertRule(` p { font-size: 2rem; } `, sheet.cssRules.length );