Добавление изображения в контейнер для JavaScript

0

Я новичок в Javascript, поэтому прошу прощения за этот относительно простой вопрос. У меня есть фотография, которую я заинтересован в добавлении к нижней части контейнера (обертки). Я экспериментировал с append(), appendChild(), prepend() с относительно небольшим успехом, поэтому мне интересно, если это последовательность, которую я объявляю, или просто еще одна ошибка.

$ ( "# ImageLocation") appendTo (обертка).

img.setAttribute("src", params.imageurl);
img.setAttribute("class","imagelink");
document.getElementById("imageLocation").appendChild(img);

imageLocation, imagelink все были объявлены в моем файле CSS, но я получаю следующую ошибку: Uncaught TypeError: Не удается вызвать метод appendChild из null.

На какие еще вещи я должен смотреть? Благодарю!

  • 0
    Убедитесь, что вы запускаете этот код, когда imageLocation уже доступен в DOM.
Теги:

2 ответа

0
Лучший ответ

С помощью JQuery вы можете сделать это:

$('<img />').attr('src','file.png').addClass('some-class').appendTo('.container');

Это создаст элемент изображения, установит источник изображения, добавит класс и, наконец, добавит все в контейнер в DOM.

0

Если вы хотите добавить изображение с помощью Javascript, вы можете сделать это следующим образом:

var img = document.createElement('img');
img.setAttribute("src", params.imageurl);
img.setAttribute("class","imagelink");
document.getElementById("imageLocation").appendChild(img);

Однако сообщение об ошибке предполагает, что document.getElementById("imageLocation") возвращает значение null, что означает, что нет элемента с идентификатором imageLocation.

Убедитесь, что идентификатор верен, и сценарий выполняется после создания элемента браузером.

Это можно сделать, разместив скрипт в нижней части страницы или используя это. Если вы используете jQuery, вы можете обернуть код внутри

$('document').ready(function () {
    //code to execute
});
  • 0
    Спасибо - это сработало!

Ещё вопросы

Сообщество Overcoder
Наверх
Меню