Может ли jQuery указать имя тега?

У меня есть несколько элементов на HTML-странице, которые имеют один и тот же класс, но они разные типы элементов. Я хочу узнать имя тега элемента, когда я перехожу через них, но .attr не принимает "тег" или "тэг".

Вот что я имею в виду. Рассмотрим эти элементы на странице:

<h1 class="rnd">First</h1>
<h2 id="foo" class="rnd">Second</h2>
<h3 class="rnd">Third</h3>
<h4 id="bar" class="rnd">Fourth</h4>

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

$(function() {
  $(".rnd").each(function(i) {
    var id = $(this).attr("id");
    if (id === undefined || id.length === 0) {
      // this is the line that giving me problems.
      // .attr("tag") returns undefined
      $(this).attr("id", "rnd" + $(this).attr("tag") + "_" + i.toString());
    }
  });
});

В результате я бы хотел, чтобы элементы H2 и H4 имели id of

rndh2_1
rndh4_3

соответственно.

Любые идеи о том, как я могу узнать имя тега элемента, представленного "this"?

Ответ 1

$(this).attr("id", "rnd" + $(this).attr("tag") + "_" + i.toString());

должен быть

$(this).attr("id", "rnd" + this.nodeName.toLowerCase() + "_" + i.toString());

Ответ 2

Вы можете попробовать следующее:

if($(this).is('h1')){
  doStuff();
}

См. docs для получения дополнительной информации о is().

Ответ 3

Поскольку я ударил этот вопрос раньше, и это не помогло мне в моем случае (у меня не было this, но вместо этого был экземпляр селектора jQuery). Вызов get() даст вам элемент HTML, с помощью которого вы можете получить nodeName, как указано выше.

this.nodeName; // In a event handler, 'this' is usually the element the event is called on

или

$('.hello:first-child').get(0).nodeName; // Use 'get' or simply access the jQuery Object like an array
$('.hello:first-child')[0].nodeName;     // will get you the original DOM element object

Ответ 4

Вы также можете использовать $(this).prop('tagName');, если вы используете jQuery 1.6 или выше.

Ответ 5

Да. Вы можете использовать приведенный ниже код:

this.tagName

Ответ 6

Я думаю, вы не можете использовать nodeName в jQuery, так как nodeName является свойством DOM, а сам jQuery не имеет функции или свойства nodeName. Но на основании респондента, который впервые упомянул об этом материале nodeName, вот как я смог решить проблему:

this.attr("id", "rnd" + this.attr("nodeName") + "_" + i.toString());

ПРИМЕЧАНИЕ: this здесь находится объект jQuery.

Ответ 7

Так как это вопрос, который вы приходите на google с использованием jQuery тэга первого ребенка в качестве запроса, я отправлю еще один пример:

<div><p>Some text, whatever</p></div>

$('div').children(':first-child').get(0).tagName); // ...and not $('div:first-child')[...]

Результат jquery - тэг (прописной): P

Ответ 8

Рассмотрим быстрый FILTER метод:

$('.rnd').filter('h2,h4')

возвращает:

[<h2 id=​"foo" class=​"rnd">​Second​</h2>​, <h4 id=​"bar" class=​"rnd">​Fourth​</h4>​]

так:

$('.rnd').filter('h2,h4').each(function() { /*...$(this)...*/ });

Ответ 9

Вы можете получить имя тега элемента html на всей странице.

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

        $('body').contents().on("click",function () {
          var string = this.tagName;
          alert(string);
         });

Ответ 10

you can try:
jQuery(this).get(0).tagName;
or
jQuery(this).get(0).nodeName;

Примечание: замените его на ваш селектор (h1, h3 или...)

Ответ 11

Я только что написал это для другой проблемы и подумал, что это может помочь и вам, и вам.

Использование:

  • то есть. onclick="_DOM_Trackr(this);"

Параметры:

  • DOM-Object для отслеживания
  • переключатель возврата/предупреждения (необязательно, по умолчанию = предупреждение)

Source-код:

function _DOM_Trackr(_elem,retn=false)
{
    var pathTrackr='';
    var $self=$(_elem).get(0);
    while($self && $self.tagName)
    {
        var $id=($($self).attr("id"))?('#'+$($self).attr("id")):'';
        var $nName=$self.tagName;
        pathTrackr=($nName.toLowerCase())+$id+((pathTrackr=='')?'':' > '+(pathTrackr));
        $self=$($self).parent().get(0);
    }
    if (retn)
    {
        return pathTrackr;
    }
    else
    {
        alert(pathTrackr);
    }
}

Ответ 12

Лучший способ исправить вашу проблему - заменить $(this).attr("tag") на this.nodeName.toLowerCase() или this.tagName.toLowerCase().

Оба дают точный результат!

Ответ 13

Вместо этого просто выполните:

$(function() {
  $(".rnd").each(function(i) {
    var id = $(this).attr("id");
    if (id === undefined || id.length === 0) {
      // this is the line that giving me problems.
      // .attr("tag") returns undefined
      // change the below line...
      $(this).attr("id", "rnd" + this.tagName.toLowerCase() + "_" + i.toString()); 
  });
});