Question

我正在使用自定义标签来定义应用程序中的部分，所以我有这样的事情：

<mysection>

   <form>
       <input name="myfield">
   </form>

</mysection>

我正在使用以下内容并且能够获取标签（打印到控制台，一切都很常规）

var parent = document.getElementsByTagName('mysection');

我遇到的问题是按姓名查找子字段：

var myfield = parent.getElementsByName("myfield");

...因为我不想接受任何其他'部分'可能有一个名为'myfield'的输入。

修改

var parent = document.getElementsByTagName('mysection')[0];

建议

并返回控制台部分内容，但是，getElementsByName会抛出错误：

Uncaught TypeError: Object #<NodeList> has no method 'getElementsByName'

Answer 1

使用getElementsByTagName()和getElementsByName()将返回NodeList，您需要获取列表的第一个元素，如下所示：

var parent = document.getElementsByTagName('mysection')[0];
var myfield = parent.getElementsByName("myfield")[0];

修改

你是对的，getElementsByName对元素无效。我不确定如何本地化它的功能，因为你正在尝试。它似乎只适用于document。如果要在本地化范围内使用它，则可能必须编写自己的getElementsByName实现。

第二次修改

为了好，我为你做了这个实现：D这里有它的所有“荣耀”。

Element.prototype.getElementsByName = function (arg) { var returnList = []; (function BuildReturn(startPoint) { for (var child in startPoint) { if (startPoint[child].nodeType != 1) continue; //not an element if (startPoint[child].getAttribute("name") == arg) returnList.push(startPoint[child]); if (startPoint[child].childNodes.length > 0) { BuildReturn(startPoint[child].childNodes); } } })(this.childNodes); return returnList; }; var parent = document.getElementsByTagName('mysection')[0]; var myfield = parent.getElementsByName("myfield")[0];

小修补

我错误地将元素而不是其子元素传递给递归。上面的代码已经使用现在传递的适当参数进行了编辑。见工作小提琴：http://jsfiddle.net/js6NP/5/

Answer 2

我实际上找到了一种更简单的方法来处理这个问题：

document.querySelectorAll('mysection [name="myfield"]');

在这里，您可以看到一个示例，它只修改指定部分内的字段：http://jsfiddle.net/fluidbyte/kph6H/

qSA支持现代浏览器，兼容IE8，这是支持IE7的polyfill：https://gist.github.com/2724353

Answer 3

只需使用ID：

<mysection>
    <form>
         <input name="myfield" id="fieldName">
    </form>
</mysection>

var myfield = document.getElementById("fieldName");

ID是supposed to be unique on a page。所以你不应该在访问正确的元素时遇到麻烦。

如果你真的使用名称/标记名，getElementsByTagName和getElementsByName都会返回array（空一个，如果没有找到元素）。您可以访问正确的元素，就像您访问数组中的元素一样：
document.getElementsByTagName('mysection')[0];对于标记名为mysection的第一个元素。

Answer 4

getElementsByName不适用于DOM元素引用。请改用querySelector或querySelectorAll。例如：

var parent  = document.getElementsByTagName('mysection')[0];
var myfield = parent.querySelector("[name='myfield']");

Javascript按名称获取（父级的）特定元素

4 个答案: