javascript - getElementByTagname 方法中零索引的解释

标签 javascript

我正在尝试使用 getElemenstByTagName 方法来访问某些数组元素。我已经搜索了互联网并找到了它的一些用途。我发现如果标记名末尾没有 [0],则此方法不起作用。说

在我的代码中如果我使用

var c=document.getElementsByTagName("P");

它不起作用。而我必须使用

var c=document.getElementsByTagName("P")[0];

这个[0]索引是什么意思以及为什么使用它?

完整代码:

<html>
<head>
<style>
*{margin:0px;padding:0px;}
</style>
</head>
<body>
<script>
var j=2;
var temp;
var arr=["favourite","fruit","is","mango","orange","apple"];
for(i=0;i<3;i++){
document.body.innerHTML+=arr[i]+" ";
}
setInterval(function (){

j++;

var c=document.getElementsByTagName("P")[0];
c.style.color="blue";

c.innerHTML=arr[j]+" ";
if(j==5){j=2;}

},2000);


</script>
<p style="position:absolute;float:right;top:0px;left:97px;border:0px solid black;width:60px;height:50px;"></p>
</body>
</html>

最佳答案

document.getElementsByTagName('tag-name') 返回 HTML 元素数组 ( HTMLCollection )

因此 var foo = document.getElementsByTagName('tag-name') 是一个 HTMLCollection(可以认为是 HTML 元素数组)

因此,foo[0]document.getElementsByTagName('tag-name')[0] 包含数组中的第一项,即第一个匹配的元素标记名!

了解有关 getElementsByTagName() 的更多信息:https://developer.mozilla.org/en-US/docs/Web/API/Element.getElementsByTagName

如果网页上有太多元素,那么您可以使用ID 的概念来访问元素。例如,考虑这个 HTML 摘录

<p id="topPara">....</p>
<p id="midPara">....</p>
<p id="bottomPara">....</p>

现在访问您将使用的各个元素:

var foo = document.getElementById('topPara');

这将返回 foo 中具有 id topPara 的元素,以便您现在可以使用与该元素相关的方法,例如 foo.methodName()

关于javascript - getElementByTagname 方法中零索引的解释,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23709919/

相关文章:

javascript - 为生成的图像提供 ID/类

javascript - 使用 ControllerAs 语法的 Firebase 3 向数据绑定(bind)

javascript - 获取d3.min中对象的最小值

Android 设备上的 JavaScript/HTML/CSS 应用程序——非常慢

javascript - 获取在 hidden/shown.bs.collapse 上折叠的元素

javascript - 为什么我在 UI 中没有收到验证 Flash 消息,我收到这样的 Flash 错误 [object Object],[object Object],[object Object]

javascript - Jasmine Controller 测试,预计 spy 已被调用

javascript - ReactJS - 在 React 类中初始化 jquery 插件的标准方法是什么?

javascript - 基础顶部栏下拉菜单填充错误

Javascript,在页面加载时加载 onclick,出了什么问题?