有没有办法不将 querySelectorAll 与 getElementsByTagName 链接起来？答案

【问题标题】：Is there a way not to chain querySelectorAll with getElementsByTagName?有没有办法不将 querySelectorAll 与 getElementsByTagName 链接起来？
【发布时间】：2014-10-02 21:08:11
【问题描述】：

我正在尝试从此页面获取图片：http://m.piperlime.gap.com/product.html?dn=pp438556002&dv=1&vid=1&cid=64413&pid=438556002

现在我的代码是：

var image = document.querySelectorAll('[data-index="0"]')[0]
.getElementsByTagName('img')[0].src;

有没有更简单的方法来解决这个问题？假设我需要拉出包含data-index="0" 的div。

谢谢！

编辑：我想要得到的 HTML 是这样的：

<div class="gm_product_item" data-index="0" style="width: 450px; left: 0px; transition: 0ms; -webkit-transition: 0ms; -webkit-transform: translate(0px, 0px) translateZ(0px);">
    <img class="gm_product_itemimg" alt="Mid Rise 11&amp;#34; Skinny Product Image" src="http://www.gap.com/webcontent/0008/860/774/cn8860774.jpg">
</div>

【问题讨论】：

@War10ck 这很容易测试，当我在控制台中输入它时不起作用。

标签： javascript custom-data-attribute selectors-api

【解决方案1】：

您可以直接在选择器中定位<img>（位于<div> 和data-index="0" 中）：

var image = document.querySelectorAll('[data-index="0"] img')[0].src

【讨论】：