Wie sieht der jQuery-Winkelklammer-Selektor aus, wie $ ('<img/>')?

Question

Manchmal sehe ich Konstrukte wie $('<img/>'). Wie unterscheidet sich $('<img/>') von $('img') und wo kann ich mehr darüber lesen?

Ich habe versucht, jQuery Selectors zu betrachten, aber nichts zu diesem Format gefunden.

Answer 1

Die jQuery-Funktion ist überladen, um neue jQuery-Elemente zu erstellen, wenn eine Zeichenfolge übergeben wird, die wie HTML aussieht. Vom docs:

Wenn eine Zeichenfolge als Parameter auf $() übergeben, untersucht jQuery die Zeichenfolge, um zu sehen, wenn es wie HTML aussieht (das heißt, es beginnt mit <tag ... >). Wenn nicht, wird die Zeichenkette als Selektor-Ausdruck interpretiert, wie oben beschrieben . Wenn die Zeichenfolge jedoch ein HTML-Snippet zu sein scheint, versucht jQuery neue DOM-Elemente zu erstellen, wie von HTML beschrieben. Dann wird ein jQuery-Objekt erstellt und zurückgegeben, das sich auf diese Elemente bezieht.

Answer 2

$('<img/>')erstellt ein Bild, während $('img') alle derzeit vorhandenen Bilder auswählt.

Answer 3

$('<img />') erstellt ein neues Element <img />, das in das DOM eingefügt werden soll.

$('img') wählt alle vorhandenen <img /> Elemente aus.

Im Allgemeinen würde man $('<img />') verwendet Elemente im DOM zu erstellen, wie folgt:

var toAppend = $('<img />'); 
toAppend.appendTo($('#myDiv')); 

Während Sie den $('img'); Selektor CSS zu handhaben (als beliebiges Beispiel) verwenden:

$('img').css('marginTop', 20); 

Das oben genannte fügt einen 20-Pixel-Rand zum oberen Rand jedes Bildes im DOM hinzu.