ES6 模板文字中的 URL 插入

Question

I have a Json file containing many objects and I want to display them using the template literals syntax in ES6. I need to display a set of images but cant passes any URL because it seems to delete the // of the address. Else everything works perfectly.

The problem seems to come from the innerHTML function because when I console log the variable containing the HTML code to be inserted the URL is written perfectly.

I would like to figure out how to fix this and display my images correctly

( the HTML inside the template literal is way longer, I just simplified it for here )

 const resultat = document.querySelector('.master-wrapper'); //where the result appear

    const html = pokedex.map(pokedex => {
        return `
                <img src"  ${ pokedex.img } "></img>  //where the url is inserted
               `;
    }).join('')

    resultat.innerHTML += html;

Answer 1

您在这里缺少=符号，因此浏览器将其呈现为删除斜杠的单独属性。

<img src="  ${ pokedex.img } "></img>  //where the url is inserted