Can jQuery provide the tag name?

我在一个 HTML 页面上有几个元素，它们具有相同的类，但是它们是不同的元素类型。我想找出元素的标签名称，因为我循环遍历它们-但是。Attr 不接受“ tag”或“ tagname”。

我的意思是，考虑一下页面上的这些元素:

<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”表示的元素的标签名有什么想法吗？

132577 次浏览
小开
最佳答案 
$(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.tagName
小开

因为我以前曾经碰到过这个问题，它对我的情况没有帮助(我没有 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
小开

你也可以用 如果使用的是 jQuery 1.6或更高版本，则使用 $(this).prop('tagName');。

小开

我认为您不能在 jQuery 中使用 nodeName，因为 nodeName 是一个 DOM 属性，而 jQuery 本身既没有 nodeName函数也没有属性。但是基于第一个提到 nodeName的受访者，这就是我如何能够解决这个问题的:

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

注意: 这里的 this是一个 jQuery 对象。

小开

因为这是一个问题，你来到谷歌使用 第一个子标签名作为一个查询，我将发布另一个例子:

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


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

Jquery 的结果是一个(大写)标签名: P

小开

考虑一下快速 过滤器方法:

$('.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)...*/ });
小开

您可以在整个页面上获得 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或...)

小开

I only just wrote it for another issue and thought it may help either of you as well.

用法:

  • 即 onclick="_DOM_Trackr(this);"

Parameters:

  1. DOM-要跟踪的对象
  2. 返回/警报开关(可选，默认 = 警报)

源代码:

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.nodeName.toLowerCase()或 this.tagName.toLowerCase()代替 $(this).attr("tag")。

两者产生完全相同的结果！

小开

相反，你只需要这样做:

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

提交答案