jQuery: Получить имя тега выбранного элемента
Существует ли простой способ получить имя тега?
Например, если я передаю $('a')
в функцию, мне нужно получить 'a'
.
5 ответ(ов)
Вы можете использовать метод .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"
На версии jQuery 1.6 теперь следует использовать метод prop
для получения свойств элементов. Например, чтобы получить имя тега, вы можете использовать следующий код:
$target.prop("tagName")
Дополнительную информацию можно найти в документации: http://api.jquery.com/prop/
Если вам нужно получить имя тега элемента с помощью jQuery, в версиях 1.6 и выше рекомендуется использовать метод .prop()
:
jQuery('selector').prop("tagName").toLowerCase()
Для старых версий jQuery можно использовать метод .attr()
:
jQuery('selector').attr("tagName").toLowerCase()
Заметьте, что использование toLowerCase()
не является обязательным, это нужно только если вам требуется имя тега в нижнем регистре.
Вот еще один способ:
$('selector')[0].tagName
Этот код извлекает имя тега первого элемента, соответствующего указанному селектору.
Вы НЕ ДОЛЖНЫ использовать jQuery('selector').attr("tagName").toLowerCase()
, так как это работает только в старых версиях jQuery.
Вы можете использовать $('selector').prop("tagName").toLowerCase()
, если вы уверены, что используете версию jQuery >= 1.6.
Примечание:
Вы можете думать, что к январю 2016 года большинство пользователей уже перешли на jQuery версии 1.10 и выше, но, к сожалению, это не так. Например, многие современные проекты всё ещё используют Drupal 7, и каждая официальная версия Drupal 7 по умолчанию включает jQuery версии 1.4.4.
Поэтому, если вы не уверены, что ваш проект будет использовать jQuery версии 1.6 или выше, рассмотрите возможность использования одного из решений, которые работают для ВСЕХ версий jQuery:
Вариант 1:
jQuery('selector')[0].tagName.toLowerCase()
Вариант 2:
jQuery('selector')[0].nodeName.toLowerCase()
Как выбрать элемент с несколькими классами в jQuery?
Как применить !important с помощью .css()?
Получить координаты (X,Y) HTML-элемента
jQuery: Получение Выбранного Значения Из Выпадающего Списка
Потеряно HTML-кодирование при чтении атрибута из поля ввода