如何在 Javascript 中从 id 获取图像的 url

我知道这是一件初学者的事情。所以我在带有 id 拇指的div 中拥有这张图像。

<img id="thumb" src="https://url-to-a-image">

而这个Javascript，它是一个放大脚本：

<script type="text/javascript">
    var myImgSrc = document.getElementById("thumb").getElementsByTagName("img") 
[0].src;
    var evt = new Event(),
    m = new Magnifier(evt);
    m.attach({
        thumb: '#thumb',
        large: 'myImgSrc',
        largeWrapper: 'preview'
    });
</script>

正如你所看到的，我正在尝试使用myImgSrc获取图像，然后我试图在大：'myImgSrc'中使用。当我把一个固定的网址放在大：固定网址到图像时，它工作正常。

带有 #thumb id 的元素是它本身img标签，当前选择器不会返回 src 值，所以它应该很简单：

var myImgSrc = document.getElementById("thumb").src;

你可以得到这样的图像src，

var thumb = document.getElementById("thumb").src;

您不需要使用 getElementsByTagName .

let img = document.querySelector('#thumb');
console.log(img.src);

如果您使用 img.src，您将看到 img 标签的来源。

getElementsByTagName是多余的 - 你已经有了你想要的确切元素 - 你通过它的ID选择了它。只有当您想通过标签获取一个或多个元素并处理所有元素时，您才需要getElementsByTagName，而不是精确地识别一个。

所以实际上解决方案非常简单 - 只需直接获取 ID 所选元素的 src 属性即可。工作演示：

var myImgSrc = document.getElementById("thumb").src;
console.log(myImgSrc);

<img id="thumb" src="https://url-to-a-image">

相关内容

最新更新

热门标签：