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