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>

ここで、次のようなものを実行して、要素がまだ定義されていない場合にすべての要素にIDがあることを確認します。

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

結果として、H2要素とH4要素のIDが

rndh2_1
rndh4_3

それぞれ。

「this」で表される要素のタグ名を見つける方法についてのアイデアはありますか？

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

する必要があります

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

あなたはこれを試すことができます：

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

is（）の詳細については、ドキュメントを参照してください。

私は以前にこの質問に出たことがあり、私の場合は役に立ちませんでした（私に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

$(this).prop('tagName');jQuery 1.6以降を使用している場合にも使用 できます。

はい。以下のコードを使用できます：

this.tagName

nodeNamenodeNameはDOMプロパティであり、jQuery自体にはnodeName関数もプロパティもないので、jQuery ではinを使用できないと思います。しかしnodeName、このことについて最初に言及した回答者に基づいて、これは私が問題を解決することができた方法です：

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

注：これthisはjQueryオブジェクトです。

これは、jquery tagname first childをクエリとして使用してグーグルで出てくる質問なので、別の例を投稿します。

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

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

jqueryの結果は（大文字の）タグ名です：P

ページ全体でhtml要素のタグ名を取得できます。

あなたは使うことができます：

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

注：これをセレクター（h1、h3または...）に置き換えてください。

私は別の問題のためにそれを書いただけで、それがあなたのどちらにも役立つかもしれないと思いました。

使用法：

• すなわち onclick="_DOM_Trackr(this);"

パラメーター：

1. トレースするDOMオブジェクト
2. return / alertスイッチ（オプション、デフォルト=アラート）

ソースコード：

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

問題を修正する最良の方法は$(this).attr("tag")、this.nodeName.toLowerCase()またはで置き換えることthis.tagName.toLowerCase()です。

どちらもまったく同じ結果になります！

高速の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)...*/ });

代わりに、単に次のようにします。

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