Hinzufügen und Entfernen von Stilattributen aus div mit jquery

Ich habe ein Projekt geerbt, an dem ich arbeite, und ich aktualisiere einige Jquery-Animationen (sehr wenig Übung mit Jquery).

Ich habe ein div, dem ich das style-Attribut hinzufügen und daraus entfernen muss. Hier ist das Div:

<div id='voltaic_holder'>

An einem Punkt in der Animation muss ich einen Stil hinzufügen:

<div id='voltaic_holder' style="position:absolute;top:-75px">

Ich habe mich umgesehen und die gefunden .removeAttr() -Methode, aber ich kann nicht sehen, wie ich sie hinzufügen soll, oder sogar entfernte Teile davon (wie oben: nur -75px).

Vielen Dank,

Sie können Folgendes tun

Legen Sie jede Stileigenschaft einzeln fest:

$("#voltaic_holder").css("position", "relative");

Legen Sie mehrere Stileigenschaften gleichzeitig fest:

$("#voltaic_holder").css({"position":"relative", "top":"-75px"});

Einen bestimmten Stil entfernen:

$("#voltaic_holder").css({"top": ""});
// or
$("#voltaic_holder").css("top", "");

Entfernen Sie das gesamte Stilattribut:

$("#voltaic_holder").removeAttr("style")

Um das Stilattribut der voltaic_holder Spanne, mach das:

$("#voltaic_holder").removeAttr("style");

So fügen Sie ein Attribut hinzu:

$("#voltaic_holder").attr("attribute you want to add", "value you want to assign to attribute");

Um nur den oberen Stil zu entfernen, gehen Sie wie folgt vor:

$("#voltaic_holder").css("top", "");

Wenn Sie jQuery verwenden, verwenden Sie css CSS hinzuzufügen

$("#voltaic_holder").css({'position': 'absolute',
    'top': '-75px'});

Zum Entfernen von CSS-Attributen

$("#voltaic_holder").css({'position': '',
    'top': ''});

Der einfachste Weg, dies zu handhaben (und obendrein die beste HTML-Lösung), besteht darin, Klassen einzurichten, die die Stile haben, die Sie verwenden möchten. Dann ist es eine einfache Frage der Verwendung addClass() und removeClass()oder auch toggleClass().

$('#voltaic_holder').addClass('shiny').removeClass('dull');

oder auch

$('#voltaic_holder').toggleClass('shiny dull');

Im Falle von .css Methode in jQuery für !wichtig Regel gilt nicht.

In diesem Fall sollten wir verwenden .attr Funktion.

Zum Beispiel: Wenn Sie Stil wie folgt hinzufügen möchten:

<div id='voltaic_holder' style="position:absolute;top:-75px !important">

Du solltest benutzen:

$("#voltaic_holder").attr("style", "position:absolute;top:-75px !important");

Hoffe es hilft jemandem.

Die Antwort ist hier, wie man dynamisch einen Stil für die Textausrichtung mit jQuery hinzufügt

Stilattribut mit J-Abfrage aus div entfernen:

$("#TableDiv").removeAttr("style");

Stil zu div mit J-Abfrage hinzufügen:

$("#TableDiv").attr("style", "display: none;");

Stil mit HTML hinzufügen:

<div class="row" id="TableDiv" style="display: none;">
</div>

Hoffe es wird hilfreich sein 🙂