Estoy tratando de crear un src para un elemento img que tengo en mi archivo HTML, pero por alguna razón, cuando intento insertar una fuente en una imagen, el espacio de trabajo no reconoce el objeto img como un objeto de imagen y, por lo tanto, lo hace. no permitir que src se inserte allí.
Es importante recalcar que este problema solo existe en el ambiente de trabajo con el que trabajo (WebStorm). Cuando traté de poner el código en un entorno de trabajo en línea, funcionó muy bien.
Mi intento de poner src en WebStorm a pesar del problema como este:
HTML:
<img id="img" src="https://source.unsplash.com/random">
JS:
let img = document.getElementById("img"); img.src = "https:\/\/images.dog.ceo\/breeds\/terrier-toy\/n02087046_3843.jpg";Pero solo hizo que el entorno de trabajo reaccionara con este error:
Cannot set properties of null (setting 'src')
Como está escrito en la pregunta, hay 2 (no, 3) opciones para corregir el error.
Opción 1 : cotización de cadena normal
img.src = "https://images.dog.ceo/breeds/terrier-toy/n02087046_3843.jpg";Opción 2 : agregue comillas alrededor de su cadena de caracteres escapada original
img.src = "https:\/\/images.dog.ceo\/breeds\/terrier-toy\/n02087046_3843.jpg";Opción 3 : Establecer el atributo
img.setAttribute("src", "https://images.dog.ceo/breeds/terrier-toy/n02087046_3843.jpg");Mira este código. setTimeout durante 2 segundos solo para visualizar. Puede eliminar setTimeout desde aquí en su caso.
function changeImage() { setTimeout(function(){ var image = document.getElementById("img") image.src = "https://i.imgur.com/xNE8K6Q.jpeg" }, 2000) } changeImage() <html> <body> <img id="img" src="https://i.imgur.com/hk1iahZ.jpeg" height="100" width="100" /> </body> </html>Los atributos de las etiquetas siempre tienen el valor de cadena, así que ponga su url como cadena. Según su código, puede probar esto:
let img = document.getElementById("img"); img.src = "https://images.dog.ceo/breeds/terrier-toy/n02087046_3843.jpg"; <img id="img" src="https://source.unsplash.com/random">