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


Answers:


1032

您可以致电.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"


请注意,按照惯例,标签名称返回CAPITALIZED。如果希望返回的标签名称全部为小写字母,则可以编辑自定义函数,如下所示:

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

例子:

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

18
在jQuery 1.6中,应为.prop
火箭Hazmat

3
所有浏览器都遵循大写约定吗?如果没有,jQuery是否将其标准化?
callum

8
tagName是DOM规范的一部分,并且始终大写。
tilleryj 2013年

请注意,返回的字符串在大写字母中。如果要尝试将其与“ div”或“ a”进行比较,这将是一个陷阱。
哈特利·布罗迪

3
将结果与标签名称进行比较时使用toLowerCase()toUpperCase()可能会有所帮助prop('tagName')if($("my_selector").prop("tagName").toLowerCase() == 'div')if($("my_selector").prop("tagName").toUpperCase() == 'DIV')
S.Thiongane 2014年

99

您可以使用DOM的nodeName属性

$(...)[0].nodeName

谢谢。效果很好-尽管我将使用更多的jQueryjQuery版本,因为我目前处于jQuery世界中。
配置器

6
纯JS解决方案(像这样的解决方案)通常优于jQuery的解决方案,特别是如果它们不遭受浏览器兼容性问题或更冗长的困扰。
史蒂文·卢

25
...特别是由于浏览器不兼容的问题,如果有人选择解决方案并且不精通要注意的浏览器不兼容问题,则jQuery的优势通常会更好。;)
Scott Stafford

4
我认为这是上乘的,因为jQuery版本无关紧要,此解决方案适用于所有版本。+1
Stijn de Witt 2012年

7
尤其是在类似each()的情况下,必须将元素强制转换回jquery对象以获取已经存在的属性,例如$(this).prop('tagname')。this.nodeName通常更有效。+1
commonpike 2012年



23

这是另一种方式:

$('selector')[0].tagName

好一个!比nodeName更清晰,甚至更短。:P
Dennis98

11

您应使用jQuery('selector').attr("tagName").toLowerCase(),因为它只能在旧版本的jQuery工作。

可以使用$('selector').prop("tagName").toLowerCase(),如果你确信你使用jQuery的版本,多数民众赞成在> = 1.6版。


注意 :

您可能会认为,到现在(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()

0

nodeName将给您标签名称大写,而localName将给您小写。

$("yourelement")[0].localName 

会给你:yourelement而不是YOURELEMENT

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.