Erstellen eines div-Elements in jQuery

Question

Wie kann ich eine div Element in jQuery ?

Answer 1

$(HTMLelement) kann es gelingen. Wenn Sie ein epmty div wollen, verwenden Sie es als $('<div></div>'); . Sie können auch die anderen Elemente nach der gleichen Methode einstellen. Wenn Sie das innere HTML nach der Erstellung ändern möchten, können Sie html() Methode. Um outerHTML als String zu erhalten, können Sie Folgendes verwenden:

var element = $('<div/>');
var innerHTML = element.html(); // if you want set new HTML use it like this element.html('<b>new HTML</b>');
var outerHTML = element[0].outerHTML;

Answer 2

Sie können verwenden .add() um eine neue jQuery Objekt und fügen Sie sie dem gewünschten Element hinzu. Verwenden Sie dann die Verkettung, um fortzufahren.

Zum Beispiel jQueryApi :

$( "div" ).css( "border", "2px solid red" )
  .add( "p" )
  .css( "background", "yellow" );

 div {
    width: 60px;
    height: 60px;
    margin: 10px;
    float: left;
  }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>

Answer 3

Wie wäre es damit? Hier, pElement verweist auf das Element, das Sie mit diesem div im Inneren (um ein Kind zu sein! :).

$("pElement").append("<div></div");

Sie können leicht noch etwas hinzufügen div in der Zeichenfolge - Attribute, Inhalt, was immer Sie wollen. Beachten Sie, dass Sie für Attributwerte die richtigen Anführungszeichen verwenden müssen.

Answer 4

Ich habe gerade eine kleine jQuery-Plugin dafür.

Er folgt Ihrer Syntax:

var myDiv = $.create("div");

DOM Die Knoten-ID kann als zweiter Parameter angegeben werden:

var secondItem = $.create("div","item2");

Ist es ernst? Nein. Aber diese Syntax ist besser als $("<div></div>") und es ist ein sehr guter Wert für dieses Geld.

(Antwort teilweise kopiert von: jQuery document.createElement gleichwertig? )