коллекция работает, массив -- нет.
Здесь 2 варианта на общих данных (картинки , стили)
Вопрос должен быть простой, т.к. есть рабочий вариант в виде :
Это работает:
<div id="myGallery">
<img src="1.jpg" />
<img src="2.jpg" />
<img src="3.jpg" />
</div>
А это не работает:
<div id="myGallery"></div>
<script src="js/list.js"></script>
<script src="js/show.js"></script>
=== внешние файлы ===
var str = [`<img src="1.jpg"/>`,
`<img src="2.jpg"/>`,
`<img src="3.jpg" />`]
function show() {
var block = [];
for (let i = 0; i < 3; i++)
block.push(str[i]);
document.getElementById('myGallery').innerHTML = block.join('');
}
window.addEventListener("load", () => { show() });
я понимаю, что это избитая тема, на форуме много вопросов по этим массивам. По этим вопроса и собрал .
Но в каждом свои особенности. Хорошо бы еще объяснение, почему не работает.
Рабочий пример с голыми <img> прост до предела. Он использует скрипты и получает результат.
Но как только мы переходим в область JS, он сразу перестает понимать другие скрипты. Все разваливается.
Прикладываю пример
SpaceGallery.zip
space-work.html -- работает.
index.html -- не работает.
В консоли ошибок нет .
У них все общее, разные только .html , разница выше.
Это простая галерея. Я уже не помню, откуда я выкопал этот пример. Он простой. Есть еще такой же пример этой же галереи, но там добавляется 1 строка из jQuery. Это на крайний случай,
Первый пример работает и без доп. строк.
Первый работает последовательно , все ОК.
Второй -- сборка массива, ему последовательность не подходит.
Расскажите, почему
