javascript

동일한 클래스를 가진 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();
}

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.tagName

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

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

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