jQuery: получить имя тега выбранного элемента

Есть ли простой способ получить имя тега?

Например, если мне передали $('a') в функцию, я хочу получить 'a'.


javascript jquery jquery-selectors
person configurator    schedule 18.03.2011    source источник
comment
возможный дубликат Есть ли в jQuery какая-либо функция для определения типа тега элемента (ов) DOM, на который ссылается объект jQuery?   -  person Darko Z    schedule 18.03.2011

Ответы (7)


arrow_upward
1082
arrow_downward

Вы можете позвонить .prop("tagName"). Примеры:

jQuery("<a>").prop("tagName"); //==> "A"
jQuery("<h1>").prop("tagName"); //==> "H1"
jQuery("<coolTagName999>").prop("tagName"); //==> "COOLTAGNAME999"


Если писать .prop("tagName") утомительно, вы можете создать собственную функцию, например:

jQuery.fn.tagName = function() {
  return this.prop("tagName");
};

Примеры:

jQuery("<a>").tagName(); //==> "A"
jQuery("<h1>").tagName(); //==> "H1"
jQuery("<coolTagName999>").tagName(); //==> "COOLTAGNAME999"


Обратите внимание, что имена тегов по соглашению возвращаются ЗАГЛАВНЫМИ буквами. Если вы хотите, чтобы возвращаемое имя тега было полностью в нижнем регистре, вы можете отредактировать пользовательскую функцию следующим образом:

jQuery.fn.tagNameLowerCase = function() {
  return this.prop("tagName").toLowerCase();
};

Примеры:

jQuery("<a>").tagNameLowerCase(); //==> "a"
jQuery("<h1>").tagNameLowerCase(); //==> "h1"
jQuery("<coolTagName999>").tagNameLowerCase(); //==> "cooltagname999"
person tilleryj    schedule 18.03.2011
comment
В jQuery 1.6 это должно быть .prop. - person Rocket Hazmat; 16.04.2012
comment
Все браузеры соблюдают правила использования заглавных букв? Если нет, нормализует ли это jQuery? - person callum; 04.09.2013
comment
tagName является частью спецификации DOM и всегда пишется с заглавной буквы. - person tilleryj; 06.09.2013
comment
Обратите внимание, что возвращаемая строка набирается ЗАГЛАВНЫМИ БУКВАМИ. Это будет ошибкой, если вы попытаетесь сравнить его, например, с div или a. - person Hartley Brody; 30.04.2014
comment
использование toLowerCase() или toUpperCase() может быть полезным при сравнении результата prop('tagName') с именем тега. if($("my_selector").prop("tagName").toLowerCase() == 'div') или if($("my_selector").prop("tagName").toUpperCase() == 'DIV') - person S.Thiongane; 04.06.2014
comment
В ответ на ответ @tilleryj заглавные буквы должны быть написаны с заглавной буквы. В любом случае, подведем итоги: - props спецификации DOM всегда верблюжий регистр - возврат в верхнем регистре; используйте .toLowerCase () для сравнения, например, с 'div' или 'select' - лучше всего использовать .prop ('tagName'), поскольку jQuery предотвращает ошибки JS. - person ReSpawN; 15.01.2015
comment
@tilleryj Обратите внимание, что имена тегов по соглашению возвращаются ЗАГЛАВНЫМИ буквами - нет, они возвращаются заглавными буквами. Использование заглавных букв означает, что только первая буква должна быть заглавной, а остальные буквы - строчными. - person Asu; 26.10.2015
comment
может кто-нибудь сказать мне, как получить имя тега из типа ‹div class = login-header›. на самом деле я просматриваю все содержимое внутри тега body, и мне нужны все имена тегов внутри него, а также идентификаторы и классы. - person thedudecodes; 06.10.2017
comment
Я проголосовал против, а не за по ошибке, и теперь я не могу это изменить - извините, @tilleryj! - person texelate; 10.05.2018
comment
Работает нормально :) - person Thulasiram; 17.07.2020

arrow_upward
103
arrow_downward

Вы можете использовать свойство nodeName модели DOM:

$(...)[0].nodeName
person SLaks    schedule 18.03.2011
comment
Спасибо. Отлично работает - хотя я буду использовать более jQueryish-версию, потому что сейчас я нахожусь в мире jQuery. - person configurator; 18.03.2011
comment
Решения на чистом JS (подобные этому) обычно превосходят решения jQuery, особенно если они не страдают от проблем совместимости с браузером или намного более подробны. - person Steven Lu; 25.07.2012
comment
... и, в частности, из-за этих проблем несовместимости с браузером, jQuery часто лучше, если кто-то выбирает решение и не знает, на какие несовместимости с браузером следует обращать внимание. ;) - person Scott Stafford; 22.08.2012
comment
Я считаю это превосходным, потому что не имеет значения, какая версия jQuery, это решение работает во всех версиях. +1 - person Stijn de Witt; 24.09.2012
comment
особенно, если вы находитесь в ситуации, подобной each (), когда вам нужно вернуть элемент обратно в объект jquery, чтобы получить свойство, которое уже было там, например $(this).prop('tagname'). this.nodeName часто более эффективен. +1 - person commonpike; 29.11.2012
comment
Я думаю, это должен был быть принятый ответ. Проблем с совместимостью браузеров нет, это быстрее и проще. - person Jevon; 18.01.2020

arrow_upward
63
arrow_downward

Начиная с jQuery 1.6, вы должны вызвать prop:

$target.prop("tagName")

См. http://api.jquery.com/prop/.

person Rob    schedule 02.12.2011

arrow_upward
49
arrow_downward

jQuery 1.6+

jQuery('selector').prop("tagName").toLowerCase()

Старые версии

jQuery('selector').attr("tagName").toLowerCase()

toLowerCase() не является обязательным.

person Dayron Gallardo    schedule 19.01.2012
comment
Почему ты делаешь new String? - person Rocket Hazmat; 16.04.2012
comment
Поскольку toLowerCase () - это метод String - person Dayron Gallardo; 25.04.2012

arrow_upward
24
arrow_downward

Это еще один способ:

$('selector')[0].tagName
person Chepech    schedule 02.03.2012
comment
Хороший! Четче, чем nodeName, и даже короче. :П - person Dennis98; 22.10.2015

arrow_upward
11
arrow_downward

Вы должны НЕ использовать jQuery('selector').attr("tagName").toLowerCase(), потому что он работает только в более старых версиях JQuery.

Вы можете использовать $('selector').prop("tagName").toLowerCase(), если уверены, что используете версию jQuery ›= версии 1.6.

Примечание :

Вы можете подумать, что КАЖДЫЙ сейчас использует jQuery 1.10+ или что-то в этом роде (январь 2016 г.), но, к сожалению, это не совсем так. Например, многие люди сегодня все еще используют Drupal 7, и каждый официальный выпуск Drupal 7 по сей день включает jQuery 1.4.4 по умолчанию.

Поэтому, если вы не знаете наверняка, будет ли ваш проект использовать jQuery 1.6+, рассмотрите возможность использования одного из вариантов, которые работают для ВСЕХ версий jQuery:

Вариант 1:

jQuery('selector')[0].tagName.toLowerCase()

Вариант 2

jQuery('selector')[0].nodeName.toLowerCase()
person John Slegers    schedule 20.01.2016

arrow_upward
0
arrow_downward

nodeName даст вам имя тега в верхнем регистре, а localName даст вам нижний регистр.

$("yourelement")[0].localName

даст вам: yourelement вместо YOURELEMENT

person Donovan P    schedule 22.05.2020