为什么JavaScript中的tagName方法以大写字母返回HTML标签？

Question

为什么JavaScript中的tagName方法以大写字母返回HTML标签？ HTML标签应使用小写字母。

Answer 1

因为那是how tagName is defined：

  

tagName属性的getter必须返回context object的HTML-uppercased qualified name。

HTML标记名称（和属性名称）不区分大小写，但是标记名称的规范版本大写，无论创建该元素的HTML是如何编写的：

document.querySelectorAll("div").forEach(function(div) {
  console.log(div.tagName);
});

<div></div>
<DIV></DIV>
<Div></Div>

这非常方便，因为这意味着查看tagName的代码在需要进行比较之前不必调用toUpperCase（或toLowerCase），如果它需要知道标记是否与特定标签名称匹配。例如，if (element.tagName === "DIV")在HTML页面中是可靠的。

Answer 2

HTML 的较早版本最初是在创建 JavaScript 时使用的，所有标签名称的大小写均按惯例使用，而不是今天的小写字母。为了保持与旧代码tagName()的向后兼容性，仍返回所有大写字母，并且已经被卡住了。

Answer 3

为完整起见，请注意tagName：

  

返回在其上被调用的元素的标签名称。例如，如果元素是，则其tagName属性为“ IMG”（对于HTML文档；对于XML / XHTML文档，可能用不同的大小写）。

使用svg查看以下结果：

[...document.querySelectorAll("*")].forEach(function(el){
  console.log(el.tagName);
});

 <svg width="300px" height="300px" 
    xmlns="http://www.w3.org/2000/svg">
    <text x="10" y="50" font-size="30">My SVG</text>
  </svg>