JQuery può fornire il nome del tag?

Ho diversi elementi su una pagina HTML che hanno la stessa classe, ma sono tipi di elementi diversi. Voglio scoprire il nome del tag dell'elemento mentre lo sovrappongo, ma .attr non accetta "tag" o "tagname".

Ecco cosa intendo. Considera questi elementi in una pagina:

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

Ora voglio eseguire qualcosa di simile per assicurarmi che i miei elementi abbiano tutti un ID se uno non è già definito:

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

Il risultato che vorrei sarebbe che gli elementi H2 e H4 avrebbero quindi un id di

rndh2_1
rndh4_3

rispettivamente.

Qualche idea su come posso scoprire il nome del tag dell'elemento rappresentato da "questo"?

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

dovrebbe essere

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

Potresti provare questo:

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

Vedere la documentazione per ulteriori informazioni su is ().

Dal momento che ho risposto a questa domanda una volta e non mi ha aiutato nel mio caso (non avevo thisun'istanza del selettore jQuery, ma invece avevo un'istanza di selettore jQuery). La chiamata get()ti darà l'elemento HTML, dal quale puoi ottenere il nodeNamecome menzionato sopra.

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

o

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

Puoi anche usarlo $(this).prop('tagName');se stai usando jQuery 1.6 o versioni successive.

Sì. Puoi usare il codice seguente:

this.tagName

Penso che non puoi usare nodeNamein jQuery poiché nodeName è una proprietà DOM e jQuery stesso non ha una nodeNamefunzione o una proprietà. Ma sulla base dell'intervistato che per primo ha menzionato queste nodeNamecose, è così che sono riuscito a risolvere il problema:

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

NOTA: thisecco un oggetto jQuery.

Poiché questa è una domanda che vieni su Google usando jquery tagname first child come query, posterò un altro esempio:

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

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

Il risultato jquery è un nome tag (maiuscolo): P

Puoi ottenere il nome del tag dell'elemento html su tutta la pagina.

Potresti usare:

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

nota: sostituiscilo con il tuo selettore (h1, h3 o ...)

L'ho appena scritto per un altro numero e ho pensato che potesse aiutare anche voi.

Uso:

• vale a dire onclick="_DOM_Trackr(this);"

parametri:

1. Oggetto DOM da tracciare
2. interruttore di ritorno / avviso (opzionale, predefinito = avviso)

Codice sorgente:

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

Il modo migliore per risolvere il tuo problema è sostituire $(this).attr("tag")con this.nodeName.toLowerCase()othis.tagName.toLowerCase() .

Entrambi producono lo stesso identico risultato!

Considera il metodo FILTER veloce :

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

ritorna:

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

così:

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

Invece fai semplicemente:

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