Search code examples
javascriptimagesrc

undefined img src found by class

So the html code of the img src that I am trying to define a variable from and just put it in an alert for starters looks like this:

<img class="ProductItem-gallery-slides-item-image" data-load="false" data-src="https://static1.squarespace.com/static/58068e2f5016e12d2c5502ff/5807a2df8419c2ae30bc4d69/5a3dd5740852297f08f5a12c/1529335692585/White-Goldie-V-neck-Tee.jpg" data-image="https://static1.squarespace.com/static/58068e2f5016e12d2c5502ff/5807a2df8419c2ae30bc4d69/5a3dd5740852297f08f5a12c/1529335692585/White-Goldie-V-neck-Tee.jpg" data-image-dimensions="750x1124" data-image-focal-point="0.5,0.5" data-position-mode="standard" data-parent-ratio="0.7" alt="White" src="https://static1.squarespace.com/static/58068e2f5016e12d2c5502ff/5807a2df8419c2ae30bc4d69/5a3dd5740852297f08f5a12c/1529335692585/White-Goldie-V-neck-Tee.jpg?format=500w" style="font-size: 0px; left: -0.312278px; top: 0px; width: 327.625px; height: 491px; position: relative;" id="yui_3_17_2_1_1530976058504_955" data-image-resolution="500w">

I am trying to get the img src with the following 

 var picture = document.getElementsByClassName("ProductItem-gallery-slides-item-image loaded").src;
 alert(picture);

It returns 

Undefined

I will mention the img src is deep within multiple divs whose ID is random.

Solution

  • Get document.getElementsByClassName() returns an array, try the following:

    document.getElementsByClassName("ProductItem-gallery-slides-item-image loaded")[0].src;

    Working example : 

    var picture = document.getElementsByClassName("ProductItem-gallery-slides-item-image loaded")[0].src;
 alert(picture);
    <img class="ProductItem-gallery-slides-item-image loaded" data-load="false" data-src="https://static1.squarespace.com/static/58068e2f5016e12d2c5502ff/5807a2df8419c2ae30bc4d69/5a3dd5740852297f08f5a12c/1529335692585/White-Goldie-V-neck-Tee.jpg" data-image="https://static1.squarespace.com/static/58068e2f5016e12d2c5502ff/5807a2df8419c2ae30bc4d69/5a3dd5740852297f08f5a12c/1529335692585/White-Goldie-V-neck-Tee.jpg" data-image-dimensions="750x1124" data-image-focal-point="0.5,0.5" data-position-mode="standard" data-parent-ratio="0.7" alt="White" src="https://static1.squarespace.com/static/58068e2f5016e12d2c5502ff/5807a2df8419c2ae30bc4d69/5a3dd5740852297f08f5a12c/1529335692585/White-Goldie-V-neck-Tee.jpg?format=500w" style="font-size: 0px; left: -0.312278px; top: 0px; width: 327.625px; height: 491px; position: relative;" id="yui_3_17_2_1_1530976058504_955" data-image-resolution="500w">