Estoy haciendo un juego simple con un fondo, tres botones, pero me he encontrado con un contratiempo. los
document.body.appendChild(img);
No agrega la imagen, solo muestra el texto alternativo. Esto es lo que tengo hasta ahora:
<script> document.body.style.backgroundImage = "url('./back.jpg')"; document.body.style.backgroundSize = 'contain'; document.body.style.backgroundRepeat = 'no-repeat'; document.body.style.backgroundPosition = 'center'; document.body.style.backgroundSize = '100%'; function show_image(src, width, height, alt) { var img = document.createElement("img"); img.src = src; img.width = width; img.height = height; img.alt = alt; document.body.appendChild(img); } show_image("url('./b.png')", 100,100,"btnBlue") </script>Esto es lo que obtengo:
¿Qué estoy haciendo mal?
Está formateando la URL de su imagen como una propiedad de fondo CSS, la fuente del elemento <img> solo toma la URL en sí:
show_image("url('./b.png')", 100, 100, "btnBlue") se convertiría en show_image("./b.png", 100, 100, "btnBlue")
function show_image(src, width, height, alt) { var img = document.createElement("img"); img.src = src; img.width = width; img.height = height; img.alt = alt; document.body.appendChild(img); } show_image("https://picsum.photos/200", 100, 100, "btnBlue")