Pregunta ¿Cómo puedo eliminar un estilo agregado con la función .css ()?


Estoy cambiando CSS con jQuery y deseo eliminar el estilo que estoy agregando basado en el valor de entrada:

if(color != '000000') $("body").css("background-color", color); else // remove style ?

¿Cómo puedo hacer esto? Tenga en cuenta que la línea anterior se ejecuta cada vez que se selecciona un color con un selector de color (es decir, cuando el mouse se mueve sobre una rueda de color).

Segunda nota: No puedo hacer esto con css("background-color", "none") porque eliminará el estilo predeterminado de los archivos css. Solo quiero eliminar el background-color estilo en línea agregado por jQuery.


730
2017-10-27 19:21


origen


Respuestas:


Cambiar la propiedad a una cadena vacía parece hacer el trabajo.

$.css("background-color", "");


1152
2017-10-27 19:22



La respuesta aceptada funciona pero deja un vacío style atributo en el DOM en mis pruebas. No es gran cosa, pero esto lo elimina todo:

removeAttr( 'style' );

Esto supone que desea eliminar todo el estilo dinámico y volver al estilo de la hoja de estilo.


491
2017-10-10 04:09



Hay varias maneras de eliminar una propiedad de CSS usando jQuery:

1. Establecer la propiedad CSS a su valor predeterminado (inicial)

.css("background-color", "transparent")

Ver el valor inicial para la propiedad CSS en MDN. Aquí el valor predeterminado es transparent. También puedes usar inherit para que varias propiedades de CSS hereden el atributo de su padre. En CSS3 / CSS4, también puede usar initial, revert o unset pero estas palabras clave pueden tener un soporte de navegador limitado.

2. Eliminar la propiedad CSS

Una cadena vacía elimina la propiedad CSS, es decir

.css("background-color","")

Pero ten cuidado, como se especifica en Documentación jQuery .css (), esto elimina la propiedad pero tiene problemas de compatibilidad con IE8 para ciertas propiedades abreviadas de CSS, que incluyen fondo.

Establecer el valor de una propiedad de estilo en una cadena vacía - p.   $ ('# mydiv'). css ('color', '') - elimina esa propiedad de un elemento   si ya se ha aplicado directamente, ya sea en el estilo HTML   atributo, a través del método .css () de jQuery, o a través de DOM directo   manipulación de la propiedad de estilo Sin embargo, no elimina un   estilo que se ha aplicado con una regla CSS en una hoja de estilo o   elemento. Advertencia: Una excepción notable es que, para IE 8 y siguientes,   eliminar una propiedad taquigráfica como borde o fondo   eliminar ese estilo por completo del elemento, independientemente de lo que se establece   en una hoja de estilo o elemento.

3. Eliminar todo el estilo del elemento

.removeAttr("style")

155
2018-05-09 13:25



Conseguí eliminar un atributo de estilo con JavaScript puro solo para que conozcas el camino del JavaScript puro

var bodyStyle = document.body.style;
if (bodyStyle.removeAttribute)
    bodyStyle.removeAttribute('background-color');
else        
    bodyStyle.removeProperty('background-color');

40
2017-11-15 09:40



cualquiera de estas funciones jQuery debería funcionar:

$("#element").removeAttr("style");
$("#element").removeAttr("background-color") 

15
2017-08-28 13:42



Esto eliminará la etiqueta completa:

  $("body").removeAttr("style");

13
2017-12-01 15:00



Solo usando:

$('.tag-class').removeAttr('style');

o

$('#tag-id').removeAttr('style');

6
2017-12-01 14:45



¿Qué tal algo así como:

var myCss = $(element).attr('css');
myCss = myCss.replace('background-color: '+$(element).css('background-color')+';', '');
if(myCss == '') {
  $(element).removeAttr('css');
} else {
  $(element).attr('css', myCss);
}

5
2017-11-27 16:11



Prueba esto:

$('#divID').css({"background":"none"});// remove existing

$('#divID').css({"background":"#bada55"});// add new color here.

Gracias


5
2018-01-08 07:14