Javascript положить изображение в промежуток

Question

Мой код, который должен поместить изображение в <span>, выглядит следующим образом:

document.getElementById("f_name_mark").innerText = "<img src='images/icons/tick.png' class='mark'>";

Однако вывод <img src='images/icons/tick.png' class='mark'> в виде текстовой строки.Вы не можете поместить изображение в <span>?

Answer 1

Используйте InnerHTML вместо innerText

Свойства Innerhtml и Innertext

Однако, в отличие от InnerText, InnerHtml позволяет работать с форматированным HTML-текстом и не 't автоматически кодировать и декодировать текст.Другими словами, InnerText извлекает и устанавливает содержимое тега в виде простого текста, тогда как InnerHtml извлекает и устанавливает то же содержимое, но в формате HTML

Span является встроенным элементом, а изображение является блочным элементом, вы можете установить отображениеэлемента span, чтобы заблокировать или использовать div для его обработки.

document.getElementById("f_name_mark").innerHTML = "<img src='images/icons/tick.png' class='mark'>";

Answer 2

Не используйте innerHTML или innerText. Вместо этого создайте элемент img, установите атрибуты и добавьте их в свой диапазон.

var img = document.createElement('IMG');

img.setAttribute('src', 'images/icons/tick.png');
img.setAttribute('class', 'mark');

document.getElementById("f_name_mark").appendChild(img);

Answer 3

innerHTML есть причина :) Попробуйте

document.getElementById("f_name_mark").innerHTML = "<img src='images/icons/tick.png' class='mark'>";

Answer 4

Используйте атрибут innerHTML, а не innerText.Он будет проанализирован и отображен как HTML, тогда как innerText будет отображаться как текст.

Answer 5

document.getElementById("f_name_mark").innerHTML = "<img src='images/icons/tick.png' class='mark'>";