javascripthtmlparameter-passing

HTML: image name as url parameter does not work?


I have a HTML page which that using an image name as URL parameter. Why doesn't show the image, what do i wrong?

<!DOCTYPE html>
<html lang="nl">
<head>
    <script src="lib/functions.js"></script>
</head>


<body>

<!-- test03.html?parameter=mountains.jpg -->

<img src="" id="imagename">

<script>
    const queryString = window.location.search;
    const urlParameters = new URLSearchParams(queryString);
    const Parameter = urlParameters.get('parameter');
    document.getElementById("imagename").innerHTML = Parameter;
</script>

</body>

</html>

Solution

  • You don't see your picture because you changed innerHTML, and it has nothing to do with the image's source for img HTML tag.

    The right way is document.getElementById("imagename").src = Parameter instead of document.getElementById("imagename").innerHTML = Parameter for this scenario.

    Make sure you have this image and the image path is correct.