2016-08-11 1 views
0

Ich weiß, dass ich alle Elemente mit einer bestimmten Klasse auswählen und ihre Eigenschaften mit css() ändern kann. Aber wie ändere ich das Stylesheet direkt? Ich möchte dies tun, damit alle neuen HTML-Elemente, die ich erstelle, mit der korrekten berechneten Breite und Höhe erstellt werden.Ist es möglich, ein Stilelement mit jquery auszuwählen?

$('.box').css('width', widthValue + 'px'); 

Dies funktioniert, aber wenn ich erstellen Sie ein neues Element wie .....

let newBox = $('<div class="box"></div>'); 

Dies wird natürlich nicht, erben die Breite ich vorher eingestellt. Also frage ich mich, wie ändere ich den Box-Klassenstil selbst?

Antwort

1

einen Stil für Ihre .box Klasse schreiben, und wenn Sie ein Element mit der Klasse schaffen .box es wird die Art

$('#btn').on('click', function(){ 
 
    var element = $('<div class="box">Second</div>'); 
 
    $('body').append(element); 
 
})
.box{ 
 
    background: red; 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<body> 
 
<div class='box'>First Div</div> 
 
<button id='btn'>Create Second Div</button> 
 
</body>

+0

Aber die Breite wird berechnet. –

+0

@tomwrong wenn es berechnet wird, dann berechnen und als css hinzufügen –

+0

Danke Suren, aber ich bin mir nicht sicher, ob ich das sehr vielleicht mitgeteilt habe. Ich möchte ändern den Stil ändern. Ich kenne viele Möglichkeiten, um es später zu modifizieren, aber ich habe eine Menge davon zu tun und ich suche nach einem saubereren Weg, es zu tun. –

0

Sie können mit einigen Eigenschaften erstellen Element erhalten:

$('<div>', {"class": 'box', style: "width: "+widthValue+"px"}); 

Es wird neues Element wie <div class="box" style="width: 100px"></div> generieren

+0

aber das wäre das gleiche wie $ ('div class = "box" style = "width:' + widthValue + 'px">'); Danke, aber das ist nicht meine Antwort. –

+0

@tomwrong Siehe hier: http://stackoverflow.com/questions/4232557/jquery-css-write-into-the-style-tag – Justinas

Verwandte Themen