Así que esta podría ser una pregunta extraña. Pero traté de ocultar cierto elemento HTML en el sitio web bbc.com usando element.style.display = 'none !important' en mi Google Chrome Console. Extrañamente, no oculta el elemento como lo esperaría. Tal vez sea algo menor y solo estoy supervisando algo.
Aquí está el código que uso:
var overlay = document.querySelector("div[class='fc-dialog-overlay']"); overlay.style.display = 'none !important'; No recibo un error y si inspecciono el elemento, también contiene la nueva propiedad y se parece a <div class="fc-dialog-overlay" style="display: none;"></div> , pero aún puede ser visto. El mismo problema ocurre con varios otros elementos como class='fc-consent-root' .
Nota : No hagas lo de setAttribute continuación, usa setProperty como se muestra en esta respuesta a la pregunta anterior . (Eliminaré esta respuesta cuando/si el OP no la acepta).
Está especificando un valor de propiedad no válido; !important se puede usar en las reglas de estilo, pero no en los valores específicos que asigna a través del objeto de style . Me sorprende que estés viendo la display: none en el área de style . No lo hago con Chrome o Firefox cuando hago eso (¿tal vez me sobró haber hecho .display = "none" y no verlo funcionar?):
const overlay = document.getElementById("example"); overlay.style.display = "none !important"; <div id="example">x</div> <div>y</div> Si hago clic con el botón derecho en x y lo miro, no tiene ningún style , incluso después de ejecutar el código.
Todavía puede hacerlo, solo tiene que asignar todo el atributo de style para obtener un análisis completo de las reglas:
const overlay = document.getElementById("example"); overlay.setAttribute( "style", overlay.getAttribute("style") + "; display: none !important" ); #example { display: block !important; } <div id="example">x</div> <div>y</div> Tenga en cuenta que funciona a pesar de que tengo una regla !important en conflicto aplicada a través de una hoja de estilo. Esto se debe a que una regla !important de hoja de estilo anula un estilo en línea a menos que el estilo en línea también tenga !important .