Генерация HTML со строками

Я пытаюсь добавить изображение в HTML. Используя следующие работы:

<img id="image1" src="http://image.jpg" alt=" " width="300" height="300" />

Все, что я хочу сделать, это заменить http переменной, чтобы я мог звонить на веб-сайт, а не делать его физически встроенным:

<img id="image1" src=URL alt=" " width="300" height="300" />

Кто-нибудь может помочь?

3 ответа

Решение

Вы хотите динамически изменить свой атрибут src, вот как это сделать:

// we selct the element to change in a variable
var el = document.getElementById("image1");

// we define a new image
var new_url = 'https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcT744-ntmnfTx78ZjYUG9t_SkW-M2JmpJaUr6iYlyhaVzkXT9q2';

// we set the new image
el.setAttribute("src",new_url);
<img id="image1" src="http://image.jpg" alt="nothing to show" width="300" height="300" />

Получите img и установите src:

document.getElementById('image1').src='http://mywebsite.com/image.jpg';

В вашем html не устанавливайте источник изображения, но все же имейте элемент img в DOM. Т.е.:

<img id="image1" alt=" " width="300" height="300" />

В вашем javascript (который должен быть загружен внизу вашего <body> тег в вашем html) вы делаете следующее:

var img1 = document.getElementById('image1');

img1.src = "/some/url/or/file-path/here.jpg"
Другие вопросы по тегам