O jQuery pode fornecer o nome da tag?

Eu tenho vários elementos em uma página HTML que têm a mesma classe - mas eles são tipos de elementos diferentes. Quero descobrir o nome da marca do elemento conforme faço um loop sobre eles - mas .attr não aceita "tag" ou "tagname".

Aqui está o que quero dizer. Considere estes elementos em uma página:

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

Agora quero executar algo assim para garantir que todos os meus elementos tenham um id, caso ainda não tenha sido definido:

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

O resultado que eu gostaria seria que os elementos H2 e H4 teriam um id de

rndh2_1
rndh4_3

respectivamente.

Alguma idéia de como posso descobrir o nome da tag do elemento representado por "this"?

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

deveria estar

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

Você pode tentar isto:

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

Veja o documentação para mais informações sobre is ().

Já que já respondi a essa pergunta uma vez e isso não me ajudou no meu caso (eu não tinha um this, mas em vez disso tinha uma instância do seletor jQuery). Chamar get()irá obter o elemento HTML, pelo qual você pode obter o nodeNameconforme mencionado acima.

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

ou

$('.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

Você também pode usar $(this).prop('tagName');se estiver usando jQuery 1.6 ou superior.

Sim. Você pode usar o código abaixo:

this.tagName

Acho que você não pode usar o nodeNameem jQuery, pois nodeName é uma propriedade DOM e o próprio jQuery não tem uma nodeNamefunção ou propriedade. Mas, com base no entrevistado que mencionou pela primeira vez sobre essas nodeNamecoisas, foi assim que consegui resolver o problema:

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

NOTA: thisaqui está um objeto jQuery.

Já que esta é uma pergunta que você vem no google usando jquery tagname first child como uma consulta, postarei outro exemplo:

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

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

O resultado do jquery é um tagname (maiúsculo): P

Você pode obter o nome da tag do elemento html em toda a página.

Você pode usar:

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

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

observação: substitua pelo seu seletor (h1, h3 ou ...)

Acabei de escrever para outra edição e achei que pode ajudar qualquer um de vocês também.

Uso:

• ie onclick="_DOM_Trackr(this);"

Parâmetros:

1. Objeto DOM para rastrear
2. interruptor de retorno / alerta (opcional, padrão = alerta)

Código fonte:

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);
    }
}

A melhor maneira de resolver seu problema é substituí-lo $(this).attr("tag")por this.nodeName.toLowerCase()ou this.tagName.toLowerCase().

Ambos produzem exatamente o mesmo resultado!

Considere o método FILTER rápido :

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

retorna:

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

tão:

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

Em vez disso, basta fazer:

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