关于JS获取多个div下多个img的src的问题

Question

下面是我的代码：在一个div下有多个div(数量不一定，但是id都是一样的，都是marginImg),每个div下都有一个图片和一个span，用js如何获取每个img的src里的图片地址存在数组里,求代码。。。谢谢各位大虾
<div class="infoline">

<div id="info">
<a href=‘#’><img id="marginImg" src="aaa.jpg"></a>
<span style="padding-top:5">
.........
</span>
</div>
<div id="info">
<a href=‘#’><img id="marginImg" src="bbb.jpg"></a>
<span style="padding-top:5">
.........
</span>
</div>
<div id="info">
<a href=‘#’><img id="marginImg" src="ccc.jpg"></a>
<span style="padding-top:5">
.........
</span>
</div>
</div>
求JS代码，不要用jquery啊~看不懂，因为我把数据存到数组是为了用来做图片自动切换的，jquery看不懂，后边也不知道怎么做了，希望是javaScript代码，非常感谢

Answer 1

由于html代码中，id是不允许重复的，所以，我把id，修改成了class

<div class="infoline">
            <div class="info">
                <a href="#">
                    <img class="marginImg" src="aaa.jpg" /></a>
                <span style="padding-top: 5">.........
                </span>
            </div>
            <div class="info">
                <a href="#">
                    <img class="marginImg" src="bbb.jpg" /></a>
                <span style="padding-top: 5">.........
                </span>
            </div>
            <div class="info">
                <a href="#">
                    <img class="marginImg" src="ccc.jpg" /></a>
                <span style="padding-top: 5">.........
                </span>
            </div>
        </div>

    <script src="Scripts/jquery-1.8.2.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            var arrayImgs = [];
            $("div.info img.marginImg").each(function () {
                alert($(this).attr("src"));
                arrayImgs.push($(this).attr("src"));
            });
        });
    </script>

追问

有没有不用jquery的方法？？？谢谢~

Answer 2

id不允许重复,给img增加name属性,所有img的name都相同,然后用document.getElementsByName取所有img,代码如下

<div id="info">
               <a href="#">
                    <img id="marginImg" name="marginImg" src="aaa.jpg"></a>
                <span style="padding-top: 5px">.........
                </span>
            </div>
            <div id="Div1">
                <a href="#">
                    <img id="marginImg1" name="marginImg" src="bbb.jpg"></a>
                <span style="padding-top: 5px">.........
                </span>
            </div>
            <div id="Div2">
                <a href="#">
                    <img id="marginImg2" name="marginImg" src="ccc.jpg"></a>
                <span style="padding-top: 5px">.........
                </span>

 var imgs = document.getElementsByName("marginImg");

本回答被提问者和网友采纳

Answer 3

百度搜搜可以搜到