动态显示图像的URL与JavaScript

我使用标签管理器动态地将信息从网站到使用自定义JavaScript的HTML元素。我现在的代码是这样的。 PS我无法弄清楚如何正确发布。这实际上与动态显示图像的URL与JavaScript

function(){ 
    console.log("Start image variable"); 
    var element = document.getElementsByClassName("MagicZoomPlus")[0]; 
    console.log(element); 
    var image = element.getAttribute("img src").innerHTML; 
    console.log(image); 
    return image; 
}

这将返回以下调试信息

unreachable code after return statement[Learn More] trustlogo.js:28:123 
Start image variable gtm.js:1:42 
<a id="ZoomGallery" href="/uploads/products/892_3521-05 .jpg" class="MagicZoomPlus" title="Franklin Paradigm Grey Sofa"> gtm.js:1:136 
undefined gtm.js:1:186

我试图访问网站上的HTML是

<a id="ZoomGallery" href="/uploads/products/892_3521-05 .jpg" class="MagicZoomPlus" title="Franklin Paradigm Grey Sofa"><img src="/uploads/products/892_3521-05 .jpg" alt="FranklinParadigm Grey Sofa" /></a>

来源

2017-03-22 Matty2Shoes

var元素不是图像，而是链接。您可以像下面这样获取图像：http://stackoverflow.com/questions/10381296/best-way-to-get-child-nodes，并从该节点获取属性。 –

这是我最后想出，其中工程。

function myFunc() { 
    var img = document.querySelector(".MagicZoomPlus img"); 

    return img.src 
}

来源

2017-03-29 19:17:00 Matty2Shoes

你.innerHTML（开始）不需要。 getAttribute（）函数只是返回一个带有属性值的字符串;如果该属性不存在，则返回null。

为了让您元素的src，因此，您的图像的URL，你必须做的：

var imageSrc = element.getAttribute("src");

，然后在mozilla developper network

来源

2017-03-22 14:41:13 jdereynal

好，所以当我尝试使用新行时，它返回“null”我知道我失去了一些东西。 function（）{ var element = document.getElementsByClassName（“MagicZoomPlus”）[0]; var imageSrc = element.getAttribute（“src”）; return imageSrc; } – Matty2Shoes

您的标记没有您正在查找的类名（Magic zoom plus）。当您想要选择img标签以获取其src时，您在此选择锚标签。 – jdereynal

简单 return imageSrc

更多信息

您可以使用选择器，也可以直接使用点符号访问属性。如果你试图对象的链接内的图像：

function(){ 
    var image = document.querySelector(".MagicZoomPlus > img"); 
    // get 
    console.log(image.src); 
    // or set the image source 
    image.src = "https://example.com/hello.jpg"; 
    return image; 
}

来源

2017-03-22 15:13:27 Philippe

动态显示图像的URL与JavaScript

回答

相关问题