jQueryで要素名を取得する

たまに、使う。

sample

<inupt id="hello" type="text" />
<inupt class="hoge" type="text" />


<select class="hoge">
    <option>aaa</option>
</select>

console.log( $("#hello").prop("tagName") ); 
> "INPUT"

console.log( $(".hoge").prop("tagName") );
> "INPUT" //先頭しか取れない

console.log( $(".hoge").get(0).tagName );
> "INPUT"
console.log( $(".hoge").get(1).tagName );
> "SELECT"


/*
 * 下記は、冗長な書き方になっていると指摘いただきました。
 * 詳しくはコメント欄を参照ください
 */

//eachで回す 
$(".hoge").each(function(){ 
    console.log( $(this).prop("tagName") ); 
});
> "INPUT"
> "SELECT"


//mapで集める
var tagNameArray = $(".hoge").map(function(){
    return $(this).prop("tagName"); 
});
console.log( tagNameArray );
> ["INPUT", "SELECT"]