Question

在下面的示例中，DOM元素有类似数组的对象，有一件事我不清楚。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>

<script type="text/javascript">
window.onload = function(){

    for(var prop in document.links){
        alert(prop); // It does not alert foo!
    }

}
</script>
</head>
<body>

<a name="foo" href="#">foo</a>

</body>
</html>

理论上，访问道具的对象符号如下：obj.prop。在类似于对象数组中，对象的元素必须有数字表示法：obj[0]和obj.length。

提醒：0，length，item，namedItem。前两个是来自对象数组的理论，另外两个可用于访问道具。

最后，可以找到document.links[0]和document.links.foo这样的链接。 foo中没有document.links道具。为什么？感谢。

Answer 1

document.links.foo无法使用的原因是因为您使用的是name而非id。如果您将标记更改为：

<a id="foo" href="#">foo</a>

然后this will work：

window.onload = function(){
    window.alert(document.links.foo.innerHTML);
}

Answer 2

您将DOM元素本身传递给“alert（）”。传递“name”属性怎么样？

for(var prop in document.links){
    alert(prop.name);
}

现在，迭代这样的节点列表真是个坏主意：

for (var i = 0; i < document.links.length; ++i)
  alert(document.links[i].name);

如果您想要节点的文本内容，那么您可以尝试：

for (var i = 0; i < document.links.length; ++i)
  alert(document.links[i].innerHTML);

您还可以找到其子文本节点并提取其值。

请注意，“链接”对象还包含<area>标记，如果您有任何标记。

DOM元素的对象表示法

2 个答案: