Как заменить элемент в массиве элементом, которого нет в указанном массиве?

Question

Итак, я хочу, чтобы одно из изображений в массиве изменилось на знак вопроса. Вот что у меня есть.

var icons = new Array ();

    icons [0] = {   html: "Animals/Ape.png" };
    icons [1] = {   html: "Animals/Bat.png" };
    icons [2] = {   html: "Animals/Cow.png" };
    icons [3] = {   html: "Animals/Emu.png" };
    icons [4] = {   html: "Animals/Pig.png" };
    icons [5] = {   html: "Animals/Dog.png" };
    icons [6] = {   html: "Animals/Rat.png" };
    icons [7] = {   html: "Animals/Yak.png" };
    icons [8] = {   html: "Animals/Cat.png" };

function showBack()
    {
    document.getElementById('table').style.display = "none";
    document.getElementById('tableblank').style.display = "block";
    icons[0]="Animals/Q.png";

    setTimeout(showFront,3000);
    }

function showFront()
    {
    document.getElementById('table').style.display = "block";
    document.getElementById('tableblank').style.display = "none";
    document.getElementById('speech').style.display = "block";
    document.getElementById('typewindow').style.display = "block";

    }

Я попробовал пару решений, но я не смог ничего сделать. Спасибо за помощь:)

Answer 1

Я бы сделал что-то вроде этого ...

var icons = [ "Animals/Ape.png", 
              "Animals/Bat.png",
              "Animals/Cow.png" ];

icons[1] = "Animals/Q.png";
document.write(icons[1]);

или если вы хотите сохранить URL как объект ...

var oIcons = [{ html:"Animals/Ape.png" }, 
              {html:"Animals/Bat.png"}, 
              {html:"Animals/Cow.png"}];

oIcons[2].html = "Animals/Q.png";
document.write(oIcons[2].html);

Так что в основном на шоу ты должен иметь ...

 icons[0].html="Animals/Q.png";

Answer 2

Учитывая код, который вы разместили в своем комментарии:

<div id="containerGameplay">
    <div id = "table">
        <script>
            for (i = 0; i < 9 ; i++) {
                document.write ("<div class = 'tile'><img src='" + icons[i].html+ "'></div>");
            }
        </script>
    </div>

Вы запускаете встроенный код на своей странице, который выполняется, как только браузер загружает его. Чтобы изменить изображение позже, вам нужно создать ссылку на элемент, который вы хотите изменить. Самый простой способ сделать это - дать идентификаторы элементов, которые бы изменили ваш код следующим образом:

document.write("<div class='title'><img id='icon_" + i + "' src='" + icons[i].html+ "'></div>");

В результате первое изображение (icon[0]) будет применено к элементу с идентификатором "icon_0" и т. Д. Для каждого изображения.

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

elem = document.getElementById('icon_0');
elem.src = "Animals/Q.png"; 

Или, следуя тому, что, как я считаю, вы пытались сделать изначально, вы можете изменить массив, а затем установить новый источник (src):

icons[0].html = "Animals/Q.png";
document.getElementById('icon_0').src = icons[0].html;

Они оба одинаковы, но второй пример также хранит значение в вашем массиве. Имейте в виду, что автоматическое связывание данных отсутствует, поэтому простое изменение массива не приводит к автоматическому обновлению элемента изображения.

Answer 3

если вы хотите переназначить этот объект, вы можете сделать это так:

icons[0].html = "Animals/Q.png";