Question

由于getElementsByTagName（）函数是新的（DOM-1？），我想要另一个更可靠的方法来获取基于其标记名称/ id的元素的引用。

编辑 - 不使用框架，因为我需要减小尺寸;所以10-20K的框架是不可接受的。我只需要可以获取元素的JS代码

Answer 1

getElementsByTagName不是新的。根据{{3}}

，IE5，FF1和Opera 7支持它

[编辑] 感谢您指出了这一点。自Opera 7以来它确实得到了支持。

Answer 2

如上所述，getElementsByTagName不是新的......

我认为你将获得大约10个jQuery的引用。

返回所有段落元素：

$('p').length

如果19kb太大，而你只想进行元素选择，那么像sizzle这样的东西效果很好，大约4kb。我唯一要注意的是，你可能最终还是需要jQuery中的东西。

http://sizzlejs.com/

查询非常相似：

Sizzle("li");

19kb是一个非常小的一次性价格来支付jQuery的力量。

Answer 3

如果您只想选择元素，那么使用sizzle选择器引擎而不是完整的库可能是明智之举。我会使用完整的库，但是，在有限的情况下使用选择器引擎可能很有用。

Sizzle是支持jQuery的CSS选择器引擎。

http://sizzlejs.com/

Answer 4

或原型等。你需要使用其中一个javascript胶水库来实现这一目标。如果存在，所有这些函数都将调用此函数，否则将其伪造。

Answer 5

这是一个基于jQuery 1.12.4实现的实现。如果可用，它使用getElementsByTagName。如果没有，它使用querySelectorAll（如果可用）。如果没有，它会以递归遍历的方式回落。根据{{3}}，jQuery 1.12.4支持旧版浏览器，例如IE6。

   <button onclick="openMap()" class="enter">ENTER SITE NOW</button>
max-width: 300px;
width: 100%;
margin: 10% auto;
display: block;
font-size: 2.6em;
color: #f6af5f;
border: 0;
padding: 8px 0;
background-color: #4098a5;
box-shadow: 2px 2px 8px 2px rgba(49, 49, 49, 0.51);

我接受了jQuery 1.12.4的getAll（）内部函数，并复制了它需要的两个辅助函数（jQuery.nodeName和jQuery.merge）。我还确保你可以通过在函数顶部添加几行来用“*”作为tagName来调用它。最后，在函数结束时，我注释掉了一些功能，它将当前节点添加到结果（如果匹配），并简单地返回找到的节点。

请注意，在某些情况下，该函数会返回HTMLCollection，在其他情况下会返回一个Array。还要注意，当“*”作为标记名传递时，输出因浏览器而异：Element.prototype.getElementsByTagName不返回TextNodes，但递归遍历确实如此。

或者，您可以使用themselves。 picoQuery是jQuery的一个实现，您可以在其中选择在线构建器中需要的方法。在这种情况下，您不需要任何方法，因为选择是核心的一部分，并且构建只有1kb gzip。 picoQuery是为现代浏览器编写的，但对于旧浏览器则可以回溯到jQuery 1.12.4。

getElementsByTagName的替代方案

5 个答案: