0

嗨，我想访问 javascript 中某个特定 div 下的所有图像。我的代码是：

<div id="image-container" style="background-image:url(loading.gif)">
        <div class="fade-box" id="image-1"><a href="javascript:GoNext();"><img src="2bscene-logo.gif" alt="" width="330" height="108" border="0" /></a></div>
        <div class="fade-box" id="image-2" style="display: none;"><a href="javascript:GoNext();"><img src="streetgallery-logo.gif" alt="" width="330" height="108" border="0" /></a></div>
        <div class="fade-box" id="image-3" style="display: none;"><a href="javascript:GoNext();"><img src="g4m-logo.gif" alt="" width="330" height="108" border="0" /></a></div>
</div>

虽然我的 js 代码是：

var image_slide = new Array('image-1', 'image-2', 'image-3');

我想动态地获取所有DIVs id，而不是预定义的数组。我怎样才能做到这一点？

4

2 回答 2

1

通过纯javascript，您可以尝试：

var arr = document.querySelectorAll('#image-container img');
for(var i=0;i<arr.length;i++){
    console.log(arr[i].getAttribute('src'))
}

在支持 querySelectorAll 的浏览器上。（IE8 及更高版本，其他现代版本，而不是 IE7 及更低版本。） - 正如 TJ Crowder 的评论中所述

于 2012-12-11T09:15:38.157 回答
0

使用 JavaScript，您可以使用 DOM 轻松完成此操作：

var container = document.getElementById("image-container");
var child;
var image_slide = [];
for (child = container.firstChild; child; child = child.nextSibling) {
    if (child.id && child.nodeName === "DIV") {
        image_slide.push(child.id);
    }
}

实例| 来源

请注意，上面的代码必须在元素已经在 DOM 中之后运行。确保这一点的最好方法是将script标签放在页面中它们的下方（就在关闭</body>元素之前）。

于 2012-12-11T09:15:55.560 回答