javascript - Hur kan jag ta bort en stil som lagts till med .css() funktionen?
Jag ändrar CSS med jQuery och jag vill ta bort den styling jag lägger till baserat på inmatningsvärdet:
if(color != '000000') $("body").css("background-color", color); else // remove style ?
Hur kan jag göra detta?
Observera att raden ovan körs när en färg väljs med en färgväljare (dvs. när musen rör sig över ett färghjul).
Andra anteckningen: Jag kan inte göra detta med css("background-color", "none") eftersom det kommer att ta bort standardstilen från CSS-filerna.
Jag vill bara ta bort background-color inline-stilen som lagts till av jQuery.
Svar #1
Att ändra egenskapen till en tom sträng verkar göra jobbet:
$.css("background-color", "");
Svar #2
Det accepterade svaret fungerar men lämnar ett tomt style-attribut på DOM i mina tester. Ingen stor sak, men detta tar bort det helt:
removeAttr( 'style' );
Detta antar att du vill ta bort all dynamisk stil och återgå till stilinställningarna i stilarket.
Svar #3
Det finns flera sätt att ta bort en CSS-egenskap med jQuery:
1. Ställa in CSS-egenskapen på dess standardvärde (initialt)
.css("background-color", "transparent")
Se startvärdet för CSS-egenskapen på MDN. Här är standardvärdet transparent. Du kan också använda inherit för flera CSS-egenskaper för att ärva attributet från dess förälder. I CSS3/CSS4 kan du även använda initial, revert eller unset men dessa nyckelord kan ha begränsat webbläsarstöd.
2. Ta bort CSS-egenskapen
En tom sträng tar bort CSS-egenskapen, d.v.s.
.css("background-color","")
Men var försiktig, eftersom det anges i jQuery .css()-dokumentationen, så tar detta bort egenskapen men det har kompatibilitetsproblem med IE8 för vissa CSS-förkortningsegenskaper, inklusive background.
Att sätta värdet på en stil-egenskap till en tom sträng — t.ex. $ ('#mydiv').css('color', '') — tar bort den egenskapen från ett element om den redan har tillämpats direkt, vare sig i HTML:s style-attribut, genom jQuerys .css()-metod, eller genom direkt DOM-manipulation av stil-egenskapen. Det tar däremot inte bort en stil som har tillämpats med en CSS-regel i ett stilark eller element. Varning: en anmärkningsvärd undantag är att för IE 8 och äldre, kommer borttagning av en kortformsegenskap som border eller background att helt ta bort den stilen från elementet, oavsett vad som är satt i ett stilark eller element.
3. Ta bort hela stil på elementet
.removeAttr("style")
Svar #4
Jag fick sättet att ta bort ett style-attribut med ren JavaScript, bara för att låta dig veta sättet med ren JavaScript
var bodyStyle = document.body.style;
if (bodyStyle.removeAttribute)
bodyStyle.removeAttribute('background-color');
else
bodyStyle.removeProperty('background-color');
Svar #5
Detta kommer att ta bort hela taggen :
$("body").removeAttr("style");
Svar #6
antingen av dessa jQuery-funktioner borde fungera:
$("#element").removeAttr("style");
$("#element").removeAttr("background-color")
Svar #7
Bara använder:
$('.tag-class').removeAttr('style');
eller
$('#tag-id').removeAttr('style');
Svar #8
2018
det finns ett inbyggt API för det
element.style.removeProperty(propery)
