JS - как удалить изображение с помощью JavaScript?

У меня возникла проблема с удалением изображения с помощью JS код как...

<img src="image.png" id='image_X'>
...
document.getElementById('image_X').src=''

Изображение остается неизменным:( Так что мой вопрос: как удалить изображение с помощью JS? Чтобы быть более подробным... Как динамически изменять значение атрибута src изображения?

Приветствуется любой полезный комментарий

Ответы

Ответ 1

var image_x = document.getElementById('image_X');
image_x.parentNode.removeChild(image_x);

http://jsfiddle.net/5DdyL/

Ответ 2

Это должно сделать это:

var el = document.getElementById('image_X');
el.parentNode.removeChild(el);

Здесь вы можете попробовать.

Вы можете аккуратно обернуть это в такую функцию:

function removeElement(ele) {
    ele.parentNode.removeChild(ele);
}

removeElement(document.getElementById("image_X"));

Ответ 3

Вы могли бы просто скрыть это. В ванильном JS, который будет:

document.getElementById("image_X").style.display='none';

В jQuery:

$("#image_X").css('display', 'none');

Если вы действительно хотите удалить его из DOM, существует способ removeChild, который вы могли бы вызвать в parentNode вашего элемента изображения.

Ответ 4

Получает родителя и использует removeChild.

var parent = getElementById('parentid');
var child = document.getElementById('imagex');
parent.removeChild(child);

Ответ 5

Чтобы удалить изображение в JavaScript (или вообще удалить что-либо), сначала вы должны захватить элемент, затем перейдите к его родительскому элементу, затем вы можете удалить его с помощью метода removeChild.

Ответ 6

Попробуйте использовать:

document.getElementByID("").style.visibilty="hidden";

когда вы не хотите показывать изображение и

document.getElementById("").style.visibility="visible";

когда вы хотите показать изображение.

Ответ 7

Я хочу поделиться некоторыми дополнительными советами...

@Marecky, спасибо Джареду Фарришу ответ, я мог бы выяснить некоторые полезные моменты, касающиеся JS...

Но потом я тоже должен был сделать свои собственные дополнительные исследования... Это не супер факт, а небольшая теоретическая подсказка... Итак, в результате я мог найти эти браузеры, как любое настольное приложение, конечно, создаются с помощью какой-то GUI-структуры... Как правило, большинство графических интерфейсов (например, Swing), конечно, могут использовать объекты с двойной буферизацией для отображения графики... Итак, когда это (например, FF) повторно переводит script на графические объекты, которые оживают правила синхронизации GUI...

... ОК... Из-за проблем с перерисовкой GUI для само скрипта...

Итак, мой вопрос состоял в том, чтобы играть вокруг объектов DOM... Дело в том, что тег img не обновляет событие пользовательского интерфейса, если активирован код, например document.getEelementById('image_X'). src= ''; Итак, пространство тегов <body> (по какой-то причине), я не уверен, но сохраняю какое-то "кэшированное" состояние... И, возможно, это делает img (если он в теле) стать "статическим"; Поэтому мне пришлось найти полезный дополнительный объект, который поддерживает динамическое обновление пользовательского интерфейса. В качестве теста я использовал div вместо чистого тега тела, чтобы держать img в нем; Таким образом, чтобы не обновлять тело, а только внутренний контент, и это помогло. Поэтому использование JS + HTML в моем случае было полезно...

Я надеюсь, что наконечник сбережет один день

Ответ 8

Try

 document.getEelementById('image_X').src="''";

но будет отображаться сломанное изображение