Wie kann ich die ID eines Elements mit jQuery erhalten?

$(document).ready(function() { alert($('#test').id); });

Warum funktioniert das nicht, und wie soll ich das machen?

Der jQuery-Weg:

 $('#test').attr('id') 

In Ihrem Beispiel:

 
$(document).ready(function() { alert($('#test').attr('id')); });

Oder durch das DOM:

 $('#test').get(0).id; 

oder auch :

 $('#test')[0].id; 

und Grund hinter der Verwendung von $('#test').get(0) in JQuery oder sogar $('#test')[0] ist, dass $('#test') ein JQuery-Selektor ist und ein Array () zurückgibt. der Ergebnisse nicht ein einzelnes Element durch seine Standardfunktionalität

eine Alternative für den DOM-Selektor in jquery ist

 $('#test').prop('id') 

.attr() unterscheidet sich von .attr() und $('#test').prop('foo') packt die angegebene DOM foo $('#test').attr('foo') , während $('#test').attr('foo') den angegebenen HTML- foo $('#test').attr('foo') ergreift Attribut und Sie können mehr Details über Unterschiede hier finden .

$('selector').attr('id') gibt die ID des ersten übereinstimmenden Elements zurück. Referenz .

Wenn Ihr übereinstimmender Satz mehr als ein Element enthält, können Sie den herkömmlichen Iterator ” .each , um ein Array zurückzugeben, das die einzelnen IDs enthält:

 var retval = [] $('selector').each(function(){ retval.push($(this).attr('id')) }) return retval 

Oder, wenn Sie bereit sind, ein wenig griesiger zu werden, können Sie den Wrapper vermeiden und die .map Abkürzung verwenden .

 return $('.selector').map(function(index,dom){return dom.id}) 

id ist eine Eigenschaft eines HTML- Element . Wenn Sie jedoch $("#something") schreiben, wird ein jQuery-Objekt zurückgegeben, das die entsprechenden DOM-Elemente umschließt. Um das erste übereinstimmende DOM-Element zurück zu bekommen, rufen Sie get(0)

 $("#test").get(0) 

Auf diesem nativen Element können Sie eine ID oder eine andere native DOM-Eigenschaft oder -function aufrufen.

 $("#test").get(0).id 

Aus diesem Grund funktioniert id nicht in deinem Code.

Alternativ verwenden attr Methode attr jQuery, wie andere Antworten vorschlagen, um das id Attribut des ersten übereinstimmenden Elements zu erhalten.

 $("#test").attr("id") 

Die obigen Antworten sind großartig, aber so wie sich jquery entwickelt .. so können Sie auch Folgendes tun:

 var myId = $("#test").prop("id"); 
 $.fn.extend({ id : function() { return this.attr('id'); } }); alert( $('#element').id() ); 

Einige Prüfcodes sind natürlich erforderlich, aber leicht zu implementieren!

.id ist keine gültige jquery-function. Sie müssen die function .attr() verwenden, um auf Attribute zuzugreifen, die ein Element besitzt. Sie können .attr() , um einen Attributwert zu ändern, indem Sie zwei Parameter .attr() , oder den Wert durch Angabe von eins .attr() .

http://api.jquery.com/attr/

Wenn Sie eine ID eines Elements erhalten möchten, zum Beispiel durch einen classnselektor, wenn ein Ereignis (in diesem Fall ein Klick-Ereignis) für dieses spezifische Element ausgetriggers wurde, dann wird Folgendes ausgeführt:

  $('.your-selector').click(function(){ var id = $(this).attr('id'); }); 

$('#test') gibt ein jQuery-Objekt zurück, so dass Sie nicht einfach object.id , um seine object.id zu erhalten

Sie müssen $('#test').attr('id') , das die erforderliche ID des Elements zurückgibt

Dies kann auch folgendermaßen geschehen,

$('#test').get(0).id was gleichbedeutend ist mit document.getElementById('test').id

Vielleicht nützlich für andere, die diesen Thread finden. Der folgende Code funktioniert nur, wenn Sie bereits jQuery verwenden. Die function gibt immer einen Bezeichner zurück. Wenn das Element keinen Bezeichner hat, generiert die function den Bezeichner und hängt diesen an das Element an.

 var generatedIdCounter = 0; $.fn.id = function() { var identifier = this.attr('id'); if(!identifier) { generatedIdCounter++; identifier = 'isGenerated_' + generatedIdCounter; this.attr('id', identifier); } return identifier; } 

Wie benutzt man:

 $('.classname').id(); $('#elementId').id(); 

Nun, scheint es gab keine Lösung und würde gerne meine eigene Lösung vorschlagen, die eine Erweiterung des JQuery-Prototyps ist. Ich lege das in eine Hilfsdatei, die nach der JQuery-Bibliothek geladen wird, daher die Prüfung für window.jQuery

 if (window.jQuery) { $.prototype.id = function () { if (this.length > 1) { var val = []; this.each(function (idx, el) { val.push($(el).id()); }); return val; } else { return this.attr('id'); } } } 

Es ist vielleicht nicht perfekt, aber es ist ein Anfang, vielleicht Aufnahme in die JQuery-Bibliothek zu bekommen.

Gibt entweder einen einzelnen Zeichenfolgenwert oder ein Array mit Zeichenfolgenwerten zurück. Das Array von String-Werten ist für das Ereignis, dass ein Selector mit mehreren Elementen verwendet wurde.

$('#test').attr('id') In Ihrem Beispiel:

 
$(document).ready(function() { alert($('#test').attr('id')); });
 $('tagname').attr('id'); 

Mit dem obigen Code können Sie ID erhalten.

Dies ist eine alte Frage, aber ab 2015 kann das tatsächlich funktionieren:

 $('#test').id; 

Und Sie können auch Aufgaben machen:

 $('#test').id = "abc"; 

Solange Sie das folgende JQuery-Plugin definieren:

 Object.defineProperty($.fn, 'id', { get: function () { return this.attr("id"); }, set: function (newValue) { this.attr("id", newValue); } }); 

Interessanterweise, wenn element ein DOM-Element ist, dann:

 element.id === $(element).id; // Is true! 

Wichtig: Wenn Sie ein neues Objekt mit jQuery erstellen und ein Ereignis binden , MÜSSEN Sie prop und nicht attr wie folgt verwenden :

$("

",{ id: "yourId", class: "yourClass", html: "" }).on("click", function(e) { alert($(this).prop("id")); }).appendTo("#something");

Dies kann Element-ID, class oder automatisch mit even sein

 ------------------------ $(this).attr('id'); ========================= ------------------------ $("a.remove[data-id='2']").attr('id'); ========================= ------------------------ $("#abc1'").attr('id'); ========================= 

Dies wird endlich Ihre Probleme lösen:

Nehmen wir an, Sie haben viele Schaltflächen auf einer Seite und möchten eine davon mit jQuery Ajax (oder nicht ajax) abhängig von ihrer ID ändern.

Lassen Sie uns auch sagen, dass Sie viele verschiedene Arten von Schaltflächen haben (für Formulare, zur Genehmigung und für ähnliche Zwecke), und Sie möchten, dass die jQuery nur die “Gefällt mir” -Schaltflächen behandelt.

Hier ist ein Code, der funktioniert: Die jQuery behandelt nur die Schaltflächen der class .cls-hlpb, sie nimmt die ID der angeklickten Schaltfläche und ändert sie entsprechend den Daten, die aus dem Ajax stammen.

 < !DOCTYPE html>         

Code wurde von w3schools genommen und geändert.

Da die ID ein Attribut ist, können Sie es mithilfe der Methode attr .