如何从图像标签中获取“src”属性？答案

【问题标题】：How do I get the 'src' attribute from an image tag?如何从图像标签中获取“src”属性？
【发布时间】：2016-04-20 01:27:39
【问题描述】：

我有以下 HTML，我正在尝试获取 img src 属性：

<span id="firstSpan"><img src="https://mydomain.xyz/imgs/image.jpg" alt="Image Thumbnail" width="48px" height="62px"></span>

这是我在当前对象指向 <img ...' 后尝试获取 url 的方式：

$(this).attr('src')

由于某种原因，我得到了“未定义”值

【问题讨论】：

那个代码看起来不错，你什么时候调用它？也许 $(this) 不是 img 标签。
您的上下文是什么，您是在 onclick 中运行它还是恰好在某个地方？（如果是这种情况，则值如果这将是没有 src 属性的窗口）
试试 $('#firstSpan img').attr('src')
如果你得到带有$(this).html() 的img 标签，那么你试图从父级而不是从img 中获取src 属性。尝试使用$(this).parent().attr('src') 并确保它有效
@MarcosPérezGude 是对的，但你不会选择parent()，img 是一个孩子，所以它会是$(this).find("img").attr("src")

标签： javascript jquery node.js cheerio

【解决方案1】：

我怀疑“this”实际上并不是针对图像，而是针对点击的跨度。试试这个：

HTML：

<span id="firstSpan"><img class="foo" 
src="https://mydomain.xyz/imgs/image.jpg" alt="Image Thumbnail" width="48px" height="62px"></span>

JS：

var source =  $(".foo").attr('src');
console.log(source);

【讨论】：

【解决方案2】：

将代码放在img元素之后：

var src = jQuery('#firstSpan').children('img').attr('src');

之前：

$(document).ready(function() {
    var src = jQuery('#firstSpan').children('img').attr('src');
})

出于性能原因，最好为 img 标签分配一个类或一个 id 并使用它来获取元素而不是 children 函数

【讨论】：

【解决方案3】：

试试：

$(document).ready(function(e) { $("#firstSpan img").attr("src"); });.

您也可以通过alert($("#firstSpan img").attr("src")) 或console.log($("#firstSpan img").attr("src")) 来查看您的代码是否也被实际调用，或者直接通过您选择的浏览器开发工具对其进行调试。

Chrome Developer Tool

Firefox Development Tool

Internet Explorer/Edge Developer Tool

Safari Developer Tool

【讨论】：

【解决方案4】：

<span id="firstSpan"><img id='myimage'src="https://mydomain.xyz/imgs/image.jpg" alt="Image Thumbnail" width="48px" height="62px"></span>

 var value = document.getElementById('myimage').src;

【讨论】：