JQuery peut-il fournir le nom de la balise?

J'ai plusieurs éléments sur une page HTML qui ont la même classe - mais ce sont des types d'éléments différents. Je veux trouver le nom de balise de l'élément lorsque je boucle dessus - mais .attr ne prend pas "tag" ou "tagname".

Voilà ce que je veux dire. Considérez ces éléments sur une page:

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

Maintenant, je veux exécuter quelque chose comme ça pour m'assurer que mes éléments ont tous un identifiant si l'un n'était pas déjà défini:

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

Le résultat que je voudrais serait que les éléments H2 et H4 auraient alors un identifiant de

rndh2_1
rndh4_3

respectivement.

Des idées sur la façon dont je peux découvrir le nom de balise de l'élément représenté par "ceci"?

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

devrait être

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

Vous pouvez essayer ceci:

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

Consultez la documentation pour en savoir plus sur is ().

Depuis que j'ai posé cette question une fois auparavant et que cela ne m'a pas aidé dans mon cas (je n'avais pas this, mais j'avais plutôt une instance de sélecteur jQuery). L'appel get()vous donnera l'élément HTML, par lequel vous pouvez obtenir le nodeNamecomme mentionné ci-dessus.

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

Vous pouvez également utiliser $(this).prop('tagName');si vous utilisez jQuery 1.6 ou supérieur.

Oui. Vous pouvez utiliser le code ci-dessous:

this.tagName

Je pense que vous ne pouvez pas utiliser le nodeNamedans jQuery car nodeName est une propriété DOM et jQuery lui-même n'a ni nodeNamefonction ni propriété. Mais sur la base du répondant qui a mentionné pour la première fois ce nodeNamegenre de choses, voici comment j'ai pu résoudre le problème:

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

REMARQUE: thisvoici un objet jQuery.

Comme il s'agit d'une question que vous venez sur google en utilisant le premier enfant de jquery tagname comme requête, je posterai un autre exemple:

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

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

Le résultat jquery est une variable (majuscule): P

Vous pouvez obtenir le nom de la balise d'élément html sur toute la page.

Vous pouvez utiliser:

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

note: remplacez-le par votre sélecteur (h1, h3 ou ...)

Je viens de l'écrire pour un autre numéro et j'ai pensé que cela pourrait également vous aider.

Usage:

• c'est à dire onclick="_DOM_Trackr(this);"

Paramètres:

1. Objet DOM à tracer
2. commutateur retour / alerte (facultatif, par défaut = alerte)

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

La meilleure façon de résoudre votre problème est de remplacer $(this).attr("tag")par this.nodeName.toLowerCase()ou par this.tagName.toLowerCase().

Les deux produisent exactement le même résultat!

Considérez la méthode rapide FILTER :

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

Retour:

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

alors:

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

Au lieu de cela, faites simplement:

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