the problem I’m facing is that I get a image URL from an input tag then storing it in a let then I create a li tag with an image tag in it. I put imageURL
variable in the src
but the image tag removes the slashes from the variable
function addMovie(title, imageURL, rating){ const li = document.createElement("li") const ul = document.getElementById("movie-list") li.className = "movie-element" li.innerHTML = ` <div class="movie-element__image> <img src="${imageURL}" alt="${title}" id="img" height="100" width = "100"> </div> <div class="movie-elements__info"> <h2> ${title} </h2> <p> ${rating}/5 rating </p> </div> ` ul.append(li); }
Advertisement
Answer
Note that has special meaning. So you need to use
\
instead of like this:
addMovie("test", "images\test\test.jpg" , 12)
function addMovie(title, imageURL, rating) { const li = document.createElement("li") const ul = document.getElementById("movie-list") li.className = "movie-element" li.innerHTML = ` <div class="movie-element__image"> <img src="${imageURL}" alt="${title}" id="img" height="100" width = "100"> </div> <div class="movie-elements__info"> <h2> ${title} </h2> <p> ${rating}/5 rating </p> </div> ` ul.append(li); } addMovie("test", "images\test\test.jpg" , 12)
<ul id="movie-list"></ul>
Also you forgot "
after movie-element__image
class