Jak Mogę uzyskać ID elementu za pomocą jQuery?

$('selector').attr('id') zwróci id pierwszego dopasowanego elementu. odniesienie .

Jeśli dopasowany zestaw zawiera więcej niż jeden element, możesz użyć konwencjonalnego .each iterator zwraca tablicę zawierającą każdy z identyfikatorów:

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

Lub, jeśli chcesz uzyskać trochę bardziej ziarniste, możesz uniknąć opakowania i użyć .map Skrót .

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

id jest właściwością html Element. Jednak gdy piszesz $("#something"), zwraca obiekt jQuery, który zawija pasujące elementy DOM. Aby odzyskać pierwszy pasujący element DOM, wywołaj get(0)

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

W tym natywnym elemencie można wywołać id, lub dowolną inną natywną właściwość lub funkcję DOM.

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

Dlatego id nie działa w Twoim kodzie.

Alternatywnie, użyj metody jQuery attr, ponieważ inne odpowiedzi sugerują, aby uzyskać atrybut id z pierwszy pasujący element.

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

Powyższe odpowiedzi są świetne, ale jak jQuery ewoluuje.. więc możesz też zrobić:

var myId = $("#test").prop("id");

$.fn.extend({
    id : function() {
        return this.attr('id');
    }
});

alert( $('#element').id() );

Wymagany oczywiście kod sprawdzający, ale łatwo zaimplementowany!

.id nie jest poprawną funkcją jquery. Aby uzyskać dostęp do atrybutów, które posiada element, należy użyć funkcji .attr(). Możesz użyć .attr(), Aby zmienić wartość atrybutu przez podanie dwóch parametrów lub uzyskać wartość przez podanie jednego.

Http://api.jquery.com/attr/

Jeśli chcesz uzyskać ID elementu, powiedzmy przez selektor klasy, gdy zdarzenie (w tym przypadku click event) zostało wywołane na tym konkretnym elemencie, to wykonamy następujące zadanie:

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

$('#test') zwraca obiekt jQuery, więc nie można użyć po prostu object.id, Aby uzyskać jego Id

Musisz użyć $('#test').attr('id'), który zwraca wymagane ID elementu

Można to również zrobić w następujący sposób,

$('#test').get(0).id która jest równa document.getElementById('test').id

Cóż, wydaje się, że nie było rozwiązania i chciałbym zaproponować własne rozwiązanie, które jest rozszerzeniem prototypów JQuery. umieściłem to w pliku pomocniczym, który jest ładowany po bibliotece JQuery, stąd sprawdzenie dla 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');
        }
    }
}

Może nie jest idealny, ale jest to początek być może włączenia do biblioteki JQuery.

Zwraca pojedynczą wartość łańcuchową lub tablicę wartości łańcuchowych. Tablica wartości łańcuchowych, jest dla zdarzenia wieloelementowym selektorem używany.

$('#test').attr('id') W twoim przykładzie:

<div id="test"></div>

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

Może przydatne dla innych, którzy znajdują ten wątek. Poniższy kod będzie działał tylko wtedy, gdy używasz już jQuery. Funkcja zwraca zawsze identyfikator. Jeśli element nie ma identyfikatora, funkcja generuje identyfikator i dołącza go do elementu.

var generatedIdCounter = 0;

$.fn.id = function() {
    var identifier = this.attr('id');

    if(!identifier) {
        generatedIdCounter++;
        identifier = 'isGenerated_' + generatedIdCounter;

        this.attr('id', identifier);
    }

    return identifier;
}

Jak używać:

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

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

$('tagname').attr('id');

Używając powyższego kodu można uzyskać id.

To jest stare pytanie, ale od 2015 roku może to zadziałać:]}

$('#test').id;

I można również wykonać zadania:

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

O ile zdefiniujesz następujący plugin JQuery:

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

Co ciekawe, jeśli element jest elementem DOM, to:

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

Ważne: jeśli tworzysz nowy obiekt z jQuery i wiążesz Zdarzenie, musisz użyć prop , a nie attr , Tak:

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

Może to być ID elementu, klasa, lub automatycznie używając even

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

To w końcu rozwiąże Twoje problemy:

Powiedzmy, że masz wiele przycisków na stronie i chcesz zmienić jeden z nich za pomocą jQuery Ajax (lub nie ajax) w zależności od ich ID.

Powiedzmy również, że masz wiele różnych typów przycisków (do formularzy, do zatwierdzania i do podobnych celów) i chcesz, aby jQuery traktowało tylko przyciski "like".

Oto kod, który działa: jQuery będzie traktować tylko przyciski, które są klasy .cls-hlpb, to zajmie id przycisk, który został kliknięty i zmieni go zgodnie z danymi pochodzącymi z ajax.

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js">    </script>
<script>
$(document).ready(function(){
$(".clshlpbtn").on('click',function(e){
var id = $(e.target).attr('id');
 alert("The id of the button that was clicked: "+id);
$.post("demo_test_post.asp",
    {
      name: "Donald Duck",
      city: "Duckburg"
    },
    function(data,status){

    //parsing the data should come here:
    //var obj = jQuery.parseJSON(data);
    //$("#"+id).val(obj.name);
    //etc.

    if (id=="btnhlp-1")
       $("#"+id).attr("style","color:red");
    $("#"+id).val(data);
    });
});




});
</script>
</head>
<body>

<input type="button" class="clshlpbtn" id="btnhlp-1" value="first btn">    </input>
<br />
<input type="button" class="clshlpbtn" id="btnhlp-2" value="second btn">    </input>
<br />
<input type="button" class="clshlpbtn" id="btnhlp-9" value="ninth btn">    </input>

</body>
</html>

Kod został pobrany z w3schools i zmieniony.

Ponieważ id jest atrybutem, można go uzyskać za pomocą metody attr.