Как я могу получить идентификатор элемента с помощью jQuery? - PullRequest
1273 голосов
/ 13 июля 2010
<div id="test"></div>
<script>
  $(document).ready(function() {
    alert($('#test').id);
  });  
</script>

Почему вышеперечисленное не работает и как мне это сделать?

Ответы [ 19 ]

2090 голосов
/ 13 июля 2010

Способ jQuery:

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

В вашем примере:

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

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

Или через DOM:

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

или даже:

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

и причина использования $('#test').get(0) в JQuery или даже $('#test')[0] заключается в том, что $('#test') является селектором JQuery и возвращает массив () результатов по умолчанию не один элементфункциональность

альтернативой селектора DOM в jquery является

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

, который отличается от .attr() и $('#test').prop('foo') захватывает указанное свойство DOM foo, тогда как $('#test').attr('foo') захватываетуказанный атрибут HTML foo, и вы можете найти более подробную информацию о различиях здесь .

79 голосов
/ 13 июля 2010

$('selector').attr('id') вернет идентификатор первого соответствующего элемента. Ссылки .

Если ваш совпавший набор содержит более одного элемента, вы можете использовать обычный .each итератор , чтобы вернуть массив, содержащий каждый из идентификаторов:

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

Или, если вы хотите немного поприличнее, вы можете избежать оболочки и использовать ярлык .map .

return $('.selector').map(function(index,dom){return dom.id})
39 голосов
/ 13 июля 2010

id является собственностью html Element. Однако, когда вы пишете $("#something"), он возвращает объект jQuery, который оборачивает соответствующий элемент (ы) DOM. Чтобы вернуть первый соответствующий элемент DOM, позвоните get(0)

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

Для этого собственного элемента вы можете вызвать id или любое другое собственное свойство или функцию DOM.

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

Именно поэтому id не работает в вашем коде.

Либо используйте метод jQuery attr, поскольку другие ответы предлагают получить атрибут id первого соответствующего элемента.

$("#test").attr("id")
25 голосов
/ 05 декабря 2013

Приведенные выше ответы - это здорово, но по мере развития jquery ... вы также можете сделать:

var myId = $("#test").prop("id");
22 голосов
/ 25 сентября 2014
$.fn.extend({
    id : function() {
        return this.attr('id');
    }
});

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

Некоторый проверочный код требуется, конечно, но легко реализуется!

10 голосов
/ 13 июля 2010

.id не является допустимой функцией jquery. Вам необходимо использовать функцию .attr() для доступа к атрибутам, которыми обладает элемент. Вы можете использовать .attr() для изменения значения атрибута, указав два параметра, или для получения значения, указав один.

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

7 голосов
/ 29 мая 2015

Если вы хотите получить идентификатор элемента, скажем, с помощью селектора класса, когда событие (в данном случае событие click) было запущено для этого конкретного элемента, тогда следующее будет делать эту работу:

 $('.your-selector').click(function(){
       var id = $(this).attr('id');
 });
5 голосов
/ 09 февраля 2017

Что ж, похоже, решения не было, и я хотел бы предложить свое собственное решение, которое является расширением прототипа JQuery.Я поместил это в файл Helper, который загружается после библиотеки JQuery, поэтому проверка для 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');
        }
    }
}

Возможно, она не идеальна, но это начало для включения в библиотеку JQuery.

Возвращает одно строковое значение или массив строковых значений.Массив строковых значений, для события использовался многоэлементный селектор.

5 голосов
/ 13 июля 2010

$('#test') возвращает объект jQuery, поэтому вы не можете просто использовать object.id, чтобы получить Id

, вам нужно использовать $('#test').attr('id'), который возвращает требуемое ID изэлемент

Это также можно сделать следующим образом:

$('#test').get(0).id, что равно document.getElementById('test').id

4 голосов
/ 27 марта 2017

$('#test').attr('id') В вашем примере:

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

$(document).ready(function() {
    alert($('#test').attr('id'));
}); 
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...