使用HTML和Javascript访问嵌套对象

html中的相关部分：

<td id="a07" bgcolor="brown">
    <button type="button" name="blabla">
        <img name="wknight" src="img/wknight.png" height="45" />
    </button>
</td>

javascript中的这段代码不起作用。我是javascript新手

我想进入图像的

src

，将其放入一个变量中，还想能够更改src。

转动这行：

<img name ="wknight" src=  "img/wknight.png" height ="45"/>

Id是页面上唯一的元素，因此您可以直接获取它

<img name ="wknight" src=  "img/wknight.png" height ="45"/>

---

Id是页面上唯一的元素，因此您可以直接获取它。我想您没有注意到javascript是区分大小写的。请改为使用此行：

var knightsource = document.getElementById("a07").blabla.wknight.src

---

我想你没有注意到javascript是区分大小写的。请改为使用此行：

var knightsource = document.getElementById("a07").blabla.wknight.src

---

使用类似于以下内容的方法可以保持html的格式不变，并通过将“a07”更改为容器id来访问其他实例（如果存在）

---

document.getElementById（“a07”）.getElementsByTagName（“img”）[0].src

使用类似于以下的内容可以使html的格式保持不变，并通过将“a07”更改为容器id来访问其他实例（如果存在）

---

document.getElementById（“a07”）.getElementsByTagName（“img”）[0]。src

这里是一个示例，假设标记的格式始终相同

CSS

HTML

))

在

考虑事项：

使用ID而不是名称作为ID必须是唯一的，而名称则不是唯一的。这可能与标记相关，也可能与标记无关，具体取决于具体情况

使用CSS类而不是内联样式：

---

此选择方法不是获得所需结果的唯一方法，您还可以使用或使用外部库，如

，这里是一个示例，假设标记的格式始终相同

CSS

HTML

))

在

考虑事项：

使用ID而不是名称作为ID必须是唯一的，而名称则不是唯一的。这可能与标记相关，也可能与标记无关，具体取决于具体情况

使用CSS类而不是内联样式：

---

此选择方法不是获得所需结果的唯一方法，您还可以使用或使用外部库，如

显示html代码。

blabla

和

wknight

也是ID吗？html中的相关部分：@adi欢迎使用SO。我为你修改了格式。下次在提问之前，请花点时间浏览一下关于格式的小帮助部分：）@adi好的，看看我的答案。如果你可以控制html，那么将img name更改为img id会让事情简单得多，你也可以添加id而不是替换名称<代码>显示您的html代码。

blabla

和

wknight

也是ID吗？html中的相关部分：@adi欢迎使用SO。我为你修改了格式。下次在提问之前，请花点时间浏览一下关于格式的小帮助部分：）@adi好的，看看我的答案。如果你可以控制html，那么将img name更改为img id会让事情简单得多，你也可以添加id而不是替换名称

由于这是一个表格单元格，可能存在多个

wknight

实例，因此id可能需要为“a07_wknight”或其他一些以避免重复。my函数仅获取表格单元格的id-仅获取“a07”@adi，因此请尝试以下解决方案：因为这是一个表格单元格，可能存在多个

wknight

实例，因此id可能需要为“a07_wknight”或其他一些以避免重复。我的函数仅获取表格单元格的id-仅获取“a07”@adi，因此请尝试此解决方案：此代码很有趣。对象TD有函数getEelment..？这些函数（getElement..和getElements..）不返回这样的元素，它们返回DOMNode和DOMNodeList（这些名称可能不正确，但其思想是正确的）。它们确实有那些方法和功能，这允许你链接它们。（对另一个函数的结果调用函数）这段代码很有趣。对象TD有函数getEelment..？这些函数（getElement..和getElements..）不返回这样的元素，它们返回DOMNode和DOMNodeList（这些名称可能不正确，但其思想是正确的）。它们确实有那些方法和功能，这允许你链接它们。（对另一个函数的结果调用函数）

var knightsource = document.getElementById("a07").blabla.wknight.src

.imgwk {
    height: 45px;
}

<table id="table01">
    <thead></thead>
    <tbody>
        <tr>
            <td id="a01" bgcolor="brown">
                <button type="button" name="blabla">
                    <img class="imgwk" name="wknight" src="http://thumb1.shutterstock.com/thumb_small/98550/98550,1278941506,3/stock-photo-white-chess-knight-56993335.jpg" />
                </button>
            </td>
            <td id="a02" bgcolor="brown">
                <button type="button" name="blabla">
                    <img class="imgwk" name="wknight" src="http://thumb1.shutterstock.com/thumb_small/98550/98550,1278941506,3/stock-photo-white-chess-knight-56993335.jpg" />
                </button>
            </td>
            <td id="a03" bgcolor="brown">
                <button type="button" name="blabla">
                    <img class="imgwk" name="wknight" src="http://thumb1.shutterstock.com/thumb_small/98550/98550,1278941506,3/stock-photo-white-chess-knight-56993335.jpgg" />
                </button>
            </td>
            <td id="a04" bgcolor="brown">
                <button type="button" name="blabla">
                    <img class="imgwk" name="wknight" src="http://thumb1.shutterstock.com/thumb_small/98550/98550,1278941506,3/stock-photo-white-chess-knight-56993335.jpg" />
                </button>
            </td>
            <td id="a05" bgcolor="brown">
                <button type="button" name="blabla">
                    <img class="imgwk" name="wknight" src="http://thumb1.shutterstock.com/thumb_small/98550/98550,1278941506,3/stock-photo-white-chess-knight-56993335.jpg" />
                </button>
            </td>
            <td id="a06" bgcolor="brown">
                <button type="button" name="blabla">
                    <img class="imgwk" name="wknight" src="http://thumb1.shutterstock.com/thumb_small/98550/98550,1278941506,3/stock-photo-white-chess-knight-56993335.jpgg" />
                </button>
            </td>
            <td id="a07" bgcolor="brown">
                <button type="button" name="blabla">
                    <img class="imgwk" name="wknight" src="http://thumb1.shutterstock.com/thumb_small/98550/98550,1278941506,3/stock-photo-white-chess-knight-56993335.jpg" />
                </button>
            </td>
        </tr>
    </tbody>
</table>

function getImgSrc(tableID, tdId) {
    var table = document.getElementById(tableID),
        tds = table.getElementsByTagName("td"),
        img,
        src;

    Array.prototype.some.call(tds, function (td) {
        if (td.id === tdId) {
            img = td.getElementsByTagName("img");
            if (img && img.length) {
                src = img[0].src;
                return true;
            }
        }

        return false;
    });

    return src;
}

function setImgSrc(tableID, tdId, src) {
    var table = document.getElementById(tableID),
        tds = table.getElementsByTagName("td"),
        img;

    Array.prototype.some.call(tds, function (td) {
        if (td.id === tdId) {
            img = td.getElementsByTagName("img");
            if (img && img.length) {
                img[0].src = src;
                return true;
            }
        }

        return false;
    });

    return src;
}

alert(getImgSrc("table01", "a07"));

setImgSrc("table01", "a07", "http://img135.imageshack.us/img135/8067/daciathaliabe5.jpg"