Question Comment puis-je obtenir l'identifiant d'un élément en utilisant jQuery?


<div id="test"></div>
<script>
  $(document).ready(function() {
    alert($('#test').id);
  });  
</script>

Pourquoi ce qui précède ne fonctionne pas, et comment dois-je faire cela?


1106
2017-07-13 17:11


origine


Réponses:


La manière de jQuery:

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

Dans votre exemple:

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

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

Ou à travers le DOM:

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

ou même :

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

et la raison derrière l'utilisation de $('#test').get(0) dans JQuery ou même $('#test')[0] est-ce $('#test') est un sélecteur JQuery et retourne un tableau () de résultats pas un seul élément par sa fonctionnalité par défaut

une alternative pour le sélecteur DOM dans jquery est

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

ce qui est différent de .attr() et $('#test').prop('foo') attrape le DOM spécifié foo propriété, tout en $('#test').attr('foo') saisit le code HTML spécifié foo attribut et vous pouvez trouver plus de détails sur les différences ici.


1810
2017-07-13 17:12



$('selector').attr('id') retournera l'identifiant du premier élément correspondant. Référence.

Si votre ensemble correspondant contient plus d'un élément, vous pouvez utiliser le .each  itérateur renvoyer un tableau contenant chacun des identifiants:

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

Ou, si vous êtes prêt à avoir un peu de cran, vous pouvez éviter l'emballage et utiliser le .map  raccourci.

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

70
2017-07-13 17:13



id est une propriété d'un html Element. Cependant, quand vous écrivez $("#something"), il renvoie un objet jQuery qui enveloppe les éléments DOM correspondants. Pour récupérer le premier élément DOM correspondant, appelez get(0)

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

Sur cet élément natif, vous pouvez appeler id, ou toute autre propriété ou fonction DOM native.

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

C'est la raison pour laquelle id ne fonctionne pas dans votre code.

Vous pouvez également utiliser jQuery attr méthode que d'autres réponses suggèrent d'obtenir le id attribut du premier élément correspondant.

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

37
2017-07-13 17:16



Les réponses ci-dessus sont excellentes, mais comme jquery évolue .. donc vous pouvez aussi faire:

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

24
2017-12-05 16:46



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

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

Un certain code de vérification requis bien sûr, mais facilement mis en œuvre!


20
2017-09-25 13:15



.id n'est pas une fonction jquery valide. Vous devez utiliser le .attr() fonction pour accéder aux attributs qu'un élément possède. Vous pouvez utiliser .attr() à la fois modifier une valeur d'attribut en spécifiant deux paramètres, ou obtenir la valeur en spécifiant un.

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


10
2017-07-13 17:17



Si vous voulez obtenir un ID d'un élément, disons par un sélecteur de classe, lorsqu'un événement (dans ce cas, un événement click) a été déclenché sur cet élément spécifique, alors ce qui suit fera le travail:

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

7
2018-05-29 10:35



$('#test') retourne un objet jQuery, donc vous ne pouvez pas utiliser simplement object.id pour obtenir son Id

vous devez utiliser $('#test').attr('id'), qui renvoie votre requis ID de l'élément

Cela peut également être fait comme suit,

$('#test').get(0).id qui est égal à document.getElementById('test').id


5
2017-07-13 17:16



Peut-être utile pour les autres qui trouvent ce fil. Le code ci-dessous ne fonctionnera que si vous utilisez déjà jQuery. La fonction renvoie toujours un identifiant. Si l'élément n'a pas d'identifiant, la fonction génère l'identifiant et l'ajoute à l'élément.

var generatedIdCounter = 0;

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

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

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

    return identifier;
}

Comment utiliser:

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

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

3
2018-02-17 10:18



Eh bien, il semble qu'il n'y ait pas eu de solution et que je voudrais proposer ma propre solution qui est une extension du prototype JQuery. Je mets cela dans un fichier Helper qui est chargé après la bibliothèque JQuery, d'où le contrôle de 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');
        }
    }
}

Ce n'est peut-être pas parfait, mais c'est un début d'inclusion dans la bibliothèque JQuery.

Renvoie une seule valeur de chaîne ou un tableau de valeurs de chaîne. Le tableau de valeurs de chaîne, est pour l'événement un sélecteur multi-élément a été utilisé.


3
2018-02-09 18:27



$('#test').attr('id') Dans votre exemple:

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

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

3
2018-03-27 09:46