使用getElementsByTagName和getAttribute方法

我组合了getElementsByTagName和getAttribute方法来获取文档中每个段落元素的title属性。下面是代码：使用getElementsByTagName和getAttribute方法

var paras = document.getElementsByTagName('p'); 
for (i = 0; i < paras.length; i++) { 
    console.log(paras[i].getAttribute('title')); 
}

的代码行我特别需要援助，这一个：

console.log(paras[i].getAttribute('title'));

什么是[i]这行代码中做什么？这是我在for循环中声明的'counter'变量，它在每次迭代中递增？ [i]也代表由getElementsByTagName函数返回的数组的索引吗？

来源

2013-01-24 user1554264

1）是的。 2）是的。 –

谢谢您的确认。 – user1554264

这里的关键是getElementsByTagName返回NodeList。

然后，您正在循环遍历NodeList（可以认为是一个数组）与您的循环。 i的值从0变为数组-1的长度。

所以要回答你的问题。是的，i是索引，当您说paras[i]时，您需要索引i处的元素。

例如，假设下面的HTML：

<body> 
    <p id="a"></p> 
    <p id="b"></p> 
    <p id="c"></p> 
</body>

如果你叫paras = document.getElementsByTagName("p")它会返回一个数组3个元素。

在paras[0]将是ID为a的p。
在paras[1]将是ID为b的p。
在paras[2]将是ID为c的p。

来源

2013-01-24 14:22:01

请注意，'getElementsByTagName'实际上会返回一个'NodeList'，而不是真正的数组。但它有一个'length'属性，所以它的行为大部分就像一个真正的数组（但是例如你不能这样做）。 –

@JamesAllardice你说得对，我相应地更新了答案。 –

是的，你说得对。段实际上是所有p标签的包含所有特殊属性

数组对象在DOM中，你可以在Chrome开发者工具运行，看看为你的自我

来源

2013-01-24 14:22:03

正如詹姆斯已经说过了，是的，是的。

.getElementsByTagName返回数组。可以通过使用索引该数组中访问的每个项目，例如：

paras[0]

访问第一元件（索引在JavaScript中从0开始 - 但要小心，一些语言从1开始）。

paras[1]

访问的第二个项目，依此类推......

它使用一个for循环阵列中的所有元素进行迭代，所以你可以做一些事情，以每个项目的通用模式。所以：

paras[i]

访问您的阵列中的我个元素。

来源

2013-01-24 14:23:41

getElementsByTagName返回一个数组。所以，你可以通过索引访问每个元素。例如：

paras[0]; // first <p> in your document 
paras[1]; // second <p> in your document 
paras[2]; // third <p> in your document 
paras[3]; // fourth <p> in your document

来源

2013-01-24 16:25:55

使用getElementsByTagName和getAttribute方法

回答

相关问题