Не получается подсоединить картинку к таблице Js

Question

Нужно сделать таблицу с 6 элементами, все эти элементы - картинки. Но не удается это сделать, картинки сами по себе, буд то ничего я и не делал. Вот код:

<body>
  <table id="mytable" border="1">
    <th>Картинка1</th>
    <th>Картинка2</th>
    <th>Картинка3</th>
    <th>Картинка4</th>
    <th>Картинка5</th>
    <th>Картинка6</th>
  </table>
  <img src="winter.jpg" width="100" height="150" id="winter">
  <img src="summer.jpg" width="100" height="150" id="summer">
  <img src="fall.jpg" width="100" height="150" id="fall">
  <img src="spring.jpg" width="100" height="150" id="spring">
  <img src="france.jpg" width="100" height="150" id="france">
  <img src="lion.jpg" width="100" height="150" id="lion">
  <script>
    table1 = document.getElementById('mytable');
    row1 = table1.insertRow(table1.rows.length);
    cell1 = row1.insertCell(row1.cells.length);
    cell1.innerHTML = document.getElementById('winter');
    cell1 = row1.insertCell(row1.cells.length);
    cell1.innerHTML = document.getElementById('summer');
    cell1 = row1.insertCell(row1.cells.length);
    cell1.innerHTML = document.getElementById('spring');
    cell1 = row1.insertCell(row1.cells.length);
    cell1.innerHTML = document.getElementById('fall');
    cell1 = row1.insertCell(row1.cells.length);
    cell1.innerHTML = document.getElementById('france');
    cell1 = row1.insertCell(row1.cells.length);
    cell1.innerHTML = document.getElementById('lion');
</script>
</body>

Надеюсь, поможете. Это для колледжа, поэтому можно без JQuery и прочих библиотек?

Answer 1

Вам нужен append вместо innerHTML:

<body>
  <table id="mytable" border="1">
    <th>Картинка1</th>
    <th>Картинка2</th>
    <th>Картинка3</th>
    <th>Картинка4</th>
    <th>Картинка5</th>
    <th>Картинка6</th>
  </table>
  <img src="winter.jpg" width="100" height="150" id="winter">
  <img src="summer.jpg" width="100" height="150" id="summer">
  <img src="fall.jpg" width="100" height="150" id="fall">
  <img src="spring.jpg" width="100" height="150" id="spring">
  <img src="france.jpg" width="100" height="150" id="france">
  <img src="lion.jpg" width="100" height="150" id="lion">
  <script>
    table1 = document.getElementById('mytable');
    row1 = table1.insertRow(table1.rows.length);
    cell1 = row1.insertCell(row1.cells.length);
    cell1.append(document.getElementById('winter'));
    cell1 = row1.insertCell(row1.cells.length);
    cell1.append(document.getElementById('summer'));
    cell1 = row1.insertCell(row1.cells.length);
    cell1.append(document.getElementById('spring'));
    cell1 = row1.insertCell(row1.cells.length);
    cell1.append(document.getElementById('fall'));
    cell1 = row1.insertCell(row1.cells.length);
    cell1.append(document.getElementById('france'));
    cell1 = row1.insertCell(row1.cells.length);
    cell1.append(document.getElementById('lion'));
</script>
</body>

БЛОГ НА HUSL

Не получается подсоединить картинку к таблице Js

Ответы (1 шт):