Question

我正在尝试访问嵌套的div标签。它很像二维数组。我希望我可以像访问它一样访问它们并尝试在javascript中执行此操作。我正在制作一艘战舰游戏，希望能够在用户猜到时改变棋盘上一个插槽的颜色。

document.getElementsByTagName("article")[0].document.getElementsByTagName("div")  
[0].document.getElementsByTagName("div")[0].style.backgroundColor='red'

可悲的是，这不起作用（不是因为我的错误。它只是不起作用）。

我想知道是否还有其他方法可以让我获取单独的嵌套div标签。

如果您想知道div标签的外观，这里是它们的一般表示。我使用css将它们变成10×10的板。我必须登上董事会。（文章[0]的原因）每行都有十个div标签嵌套在一起。

<article>
    <div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div>
    <div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div>
    <div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div>
    <div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div>
    <div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div>
    <div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div>
    <div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div>
    <div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div>
    <div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div>
    <div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div>

</article>

<article>
    <div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div>
    <div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div>
    <div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div>
    <div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div>
    <div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div>
    <div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div>
    <div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div>
    <div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div>
    <div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div>
    <div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div>

</article>

我在这里有一个小提琴http://jsfiddle.net/zachooz/hL4Qk/。它有点乱，因为我在一段时间之前做了它，而我还在学习HTML的基础知识，所以请耐心等待。

Answer 1

A.S。请在发布错误代码时包含javascript console中的错误。

document.getElementsByTagName("article")[0].document.getElementsByTagName("div")

这在许多层面都是错误的。

document是一个包含页面所有HTML节点的对象。 document.getElementsByTagName("article")返回所有HTML节点的数组，其属性name等于＆＃34;文章＆＃34;。

您假设document包含在此数组中的逻辑是完全错误的：document.getElementsByTagName.document没有任何意义。

相反，这就是你想要做的。

var divs = document.getElementsByTagName("article")[0]
var array = new Array();
for (var i = 0; i < divs.children.length; i++) {

    array[i] = divs.children[i]

}

array[2].style.backgroundColor = 'red'

你现在有一个数组，其中包含第一篇＆＃34;文章＆＃34;的所有div。标签

如果你想将它与第二篇＆＃34;文章＆＃34;要创建多维数组的标记，您可能希望迭代2个数组并自己创建它。据我所知，DOM没有提供任何方法来创建开箱即用的二维数组。你自己这样做只是一些循环问题。

如何访问div标签？

1 个答案: