Frage Erstellen eines div-Elements in jQuery [duplizieren]


Diese Frage hat hier bereits eine Antwort:

Wie erstelle ich ein div Element in jQuery?


1362
2018-05-15 10:30


Ursprung


Antworten:


Sie können verwenden append (um die letzte Position des Elternteils hinzuzufügen) oder prepend (an der ersten Position des Elternteils hinzufügen):

$('#parent').append('<div>hello</div>');    
// or
$('<div>hello</div>').appendTo('#parent');

Alternativ können Sie die .html() oder .add() wie in a erwähnt andere Antwort.


940
2018-05-15 10:43



Ab jQuery 1.4 können Sie Attribute wie folgt an ein selbst-geschlossenes Element übergeben:

jQuery('<div/>', {
    id: 'some-id',
    class: 'some-class',
    title: 'now this div has a title!'
}).appendTo('#mySelector');

Hier ist es in der Dokumente

Beispiele finden Sie unter jQuery 1.4 veröffentlicht: Die 15 neuen Funktionen, die Sie kennen müssen .


1867
2017-11-11 19:01



Technisch $('<div></div>') wird 'erstellen' a div Element (oder genauer gesagt ein DIV-DOM-Element), aber wird es nicht zu Ihrem HTML-Dokument hinzufügen. Sie müssen das dann in Kombination mit den anderen Antworten verwenden, um tatsächlich etwas Nützliches damit zu tun (z. B. mit dem append() Methode oder dergleichen).

Das Manipulation Dokumentation gibt Ihnen alle Möglichkeiten, wie Sie neue Elemente hinzufügen können.


218
2018-05-15 10:49



d = document.createElement('div');
$(d).addClass(classname)
    .html(text)
    .appendTo($("#myDiv")) //main div
.click(function () {
    $(this).remove();
})
    .hide()
    .slideToggle(300)
    .delay(2500)
    .slideToggle(300)
    .queue(function () {
    $(this).remove();
});

183
2017-08-07 22:08



div = $("<div>").html("Loading......");
$("body").prepend(div);    

71
2018-05-15 10:36



$("<div/>").appendTo("div#main");

wird ein leeres Div anhängen <div id="main"></div>


60
2018-05-15 10:34



All das hat für mich funktioniert,

HTML-Teil:

<div id="targetDIV" style="border: 1px solid Red">
    This text is surrounded by a DIV tag whose id is "targetDIV".
</div>

JavaScript-Code:

//Way 1: appendTo()
<script type="text/javascript">
    $("<div>hello stackoverflow users</div>").appendTo("#targetDIV"); //appendTo: Append at inside bottom
</script>

//Way 2: prependTo()
<script type="text/javascript">
    $("<div>Hello, Stack Overflow users</div>").prependTo("#targetDIV"); //prependTo: Append at inside top
</script>

//Way 3: html()
<script type="text/javascript">
    $("#targetDIV").html("<div>Hello, Stack Overflow users</div>"); //.html(): Clean HTML inside and append
</script>

//Way 4: append()
<script type="text/javascript">
    $("#targetDIV").append("<div>Hello, Stack Overflow users</div>"); //Same as appendTo
</script>

51
2018-01-28 04:41



Ein kurzer Weg zum Erstellen von div ist

var customDiv = $("<div/>");

Jetzt kann das benutzerdefinierte div an jedes andere div angehängt werden.


49
2018-02-25 03:46



$("<div/>").attr('id','new').appendTo('body');    

Dadurch wird ein neues div mit der ID "new" in den Körper eingefügt.


32
2018-02-03 15:56