Javascript 获取<；img>；src并通过类设置为变量（id不可用）

我试图从给定的HTML代码中获取某个图像的URL

<div class="image_div_name">
    <img src="http://www.thisistheimage.com" alt="">
</div>

如果我现在通过console.log打印图片，我会得到正确的div：

<div class="image_div_name">
    <img src="http://www.thisistheimage.com" alt="">
</div>

回馈：

undedfined

如果我尝试：

console.log(picture[0].innerHTML)

情况越来越好，我收到：

<img src="http://www.thisistheimage.com" alt="">

---

你能帮忙吗？我做错了什么？

这是因为

.image\u div\u name

没有

src

属性，您需要选择子

img

元素

给定您提供的HTML，您可以使用

图片[0]访问它。子项[0]

：

var picture = document.getElementsByClassName("image_div_name");
var src = picture[0].children[0].src;

您也可以使用

picture[0]

，而不是使用

picture[0].firstElementChild

访问第一个子项：

var picture = document.getElementsByClassName("image_div_name");
var src = picture[0].firstElementChild.src;

---

由于上述两种方法均未说明将选择

img

元素（因为您选择的是第一个子元素），因此最好使用以下方法：

var src = document.querySelector('.image_div_name > img').src;

…或：

---

这是因为

.image\u div\u name

没有

src

属性，您需要选择子

img

元素

给定您提供的HTML，您可以使用

图片[0]访问它。子项[0]

：

var picture = document.getElementsByClassName("image_div_name");
var src = picture[0].children[0].src;

您也可以使用

picture[0]

，而不是使用

picture[0].firstElementChild

访问第一个子项：

var picture = document.getElementsByClassName("image_div_name");
var src = picture[0].firstElementChild.src;

---

由于上述两种方法均未说明将选择

img

元素（因为您选择的是第一个子元素），因此最好使用以下方法：

var src = document.querySelector('.image_div_name > img').src;

…或：

---

您的目标不是

img

，而是

，这就是

innerHTML

属性包含

的原因。（图像没有

innerHTML

）

改为选择

。我用过：

---

您的目标不是

img

，而是

，这就是

innerHTML

属性包含

的原因。（图像没有

innerHTML

）

改为选择

。我用过：

您可以这样做（如果您100%确定您的div只有一个子级

）：

您可以这样做（如果您100%确定您的div只有一个子级

）：

---

尽管安迪的回答很有帮助，我还是推荐他

var picture = document.querySelectorAll(".image_div_name img");
var src = picture[0];
var src = picture[0].src;

---

尽管安迪的回答很有帮助，我还是推荐他

var picture = document.querySelectorAll(".image_div_name img");
var src = picture[0];
var src = picture[0].src;

---

document.getElementsByClassName（“image\u div\u name”）.firstElementChild.src

document.getElementsByClassName（“image\u div\u name”）.firstElementChild.src

var node = document.getElementsByClassName("image_div_name");
var src = node[0].children[0].src;
console.log(src);

var picture = document.getElementsByClassName("image_div_name")[0].getElementsByTagName("img")[0];
var src = picture.getAttribute('src');