jQuery：获取选定的元素标签名称

有没有简单的方法来获得标签名称？

例如，如果给我一个函数$('a')，我想得到'a'。

646927 次浏览
小开
最佳答案

您可以调用.prop("tagName")。示例：

jQuery("<a>").prop("tagName"); //==> "A"
jQuery("<h1>").prop("tagName"); //==> "H1"
jQuery("<coolTagName999>").prop("tagName"); //==> "COOLTAGNAME999"


如果写出.prop("tagName")很乏味，你可以像这样创建一个自定义函数：

jQuery.fn.tagName = function() {
return this.prop("tagName");
};

示例：

jQuery("<a>").tagName(); //==> "A"
jQuery("<h1>").tagName(); //==> "H1"
jQuery("<coolTagName999>").tagName(); //==> "COOLTAGNAME999"


请注意，按照惯例，标记名称返回资本化。如果您希望返回的标记名称全部小写，您可以像这样编辑自定义函数：

jQuery.fn.tagNameLowerCase = function() {
return this.prop("tagName").toLowerCase();
};

示例：

jQuery("<a>").tagNameLowerCase(); //==> "a"
jQuery("<h1>").tagNameLowerCase(); //==> "h1"
jQuery("<coolTagName999>").tagNameLowerCase(); //==> "cooltagname999"
小开

您可以使用DOM的nodeName属性：

$(...)[0].nodeName
小开

从jQuery 1.6开始，你现在应该调用prop：

$target.prop("tagName")

查看http://api.jquery.com/prop/

小开

jQuery 1.6+

jQuery('selector').prop("tagName").toLowerCase()

旧版本

jQuery('selector').attr("tagName").toLowerCase()

toLowerCase()不是强制性的。

小开

这是另一种方式：

$('selector')[0].tagName
小开

您应该使用不是，因为它仅适用于旧版本的JQuery。

如果您确定使用的是>=1.6版的jQuery版本，则可以使用$('selector').prop("tagName").toLowerCase()。

备注：

你可能认为现在（2016年1月）每个人都在使用jQuery 1.10+或其他东西，但不幸的是事实并非如此。例如，今天许多人仍在使用Drupal 7，迄今为止Drupal 7的每个官方版本都默认包含jQuery 1.4.4。

因此，如果不确定您的项目是否会使用jQuery 1.6+，请考虑使用适用于所有版本的jQuery的选项之一：

备选案文1：

jQuery('selector')[0].tagName.toLowerCase()

备选案文2

jQuery('selector')[0].nodeName.toLowerCase()
小开

nodeName将为您提供大写的标签名称，而localName将为您提供小写的标签名称。

$("yourelement")[0].localName

会给你：你的爱而不是你的爱

小开

用jQuery获取点击标签名称

jQuery("YOUR_SELECTOR").click(function (e) {
console.log(jQuery(e.target).prop("tagName").toLowerCase())
})

提交答案