web-dev-qa-db-de.com

Hinzufügen und Entfernen von Stilattributen aus div mit Jquery

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

Ich habe ein Div, aus dem ich das Stilattribut hinzufügen und entfernen muss. Hier ist das div:

<div id='voltaic_holder'>

An einer Stelle in der Animation muss ich einen Stil hinzufügen:

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

Ich habe herumgesucht und die .removeAttr()-Methode gefunden, aber ich kann nicht sehen, wie sie hinzugefügt wird, oder sogar entfernte Teile davon (nur der obere Teil: -75px).

Vielen Dank,

81
drpcken

Sie haben folgende Möglichkeiten

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")
194
Adam Albrecht

So entfernen Sie das style-Attribut des voltaic_holder-Bereichs vollständig:

$("#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");

So entfernen Sie nur den oberen Stil:

$("#voltaic_holder").css("top", "");
19
Peter Olson

Wenn Sie jQuery verwenden, fügen Sie mit css CSS hinzu

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

So entfernen Sie CSS-Attribute

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

Der einfachste Weg, dies zu tun (und die beste HTML-Lösung zum Booten), ist das Einrichten von Klassen mit den gewünschten Stilen. Dann ist es einfach, addClass () und removeClass () oder sogar toggleClass () zu verwenden.

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

oder auch

$('#voltaic_holder').toggleClass('shiny dull');
9
Surreal Dreams
2
TheHorse

Im Falle von CSS Methode in jQuery für !wichtig Regel wird nicht angewendet.

In diesem Fall sollten wir verwenden .attr Funktion.

Zum Beispiel: Wenn Sie den folgenden Stil 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.

2

Stilattribut aus div mit J-Abfrage entfernen:

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

Stil mit J-Abfrage zu div 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 :)

0
Wajid khan