JavaScript.Мой цикл for останавливается после одной итерации, когда заключен в функцию

Question

вот моя проблема.Когда мой код встроен в html-страницу, между тегами body он выполняется так, как и предполагалось: отображает 12 строк текста (цикл проходит 12 раз);

, но когда я заключаю код в функциюимпортируйте его из внешнего js-файла и попробуйте вызвать его с помощью события onclick или onsubmit, оно останавливается после первой итерации.

это код, встроенный в html-файл:

var all_imgs = document.getElementsByTagName('img');

        for(var i=0; i<all_imgs.length; i++){

            var item = all_imgs[i].src;
            var item_limit = item.length-4;
            var item_limit2 = item.length-6;

            var selected = item.substring(item_limit, item_limit2);

            if (selected == 'on') {
                document.write('image ' + i + ' with url : ' + item + ' is ');
                document.write('chosen');
                document.write('<br>');
            }
            else {
                document.write('image ' + i + ' with url : ' + item + ' is ');
                document.write('not chosen');
                document.write('<br>');
            }

        }  

и вывод:

image 0 with url : www.../thumb2_on.jpg is CHOSEN  
image 1 with url : www.../thumb2_off.jpg is NOT CHOSEN  
image 2 with url : www.../thumb2_off.jpg is NOT CHOSEN  
image 3 ...  
.  
.  
.  
image 11 with url : www.../thumb2_on.jpg is CHOSEN  

это код из внешнего js-файла:

function selectedImages(){
        var all_imgs = document.getElementsByTagName('img');

        for(var i=0; i<all_imgs.length; i++){

            var item = all_imgs[i].src;
            var item_limit = item.length-4;
            var item_limit2 = item.length-6;
            //document.write(item_limit);
            //document.write(item_limit2);

            var selected = item.substring(item_limit, item_limit2);

            if (selected == 'on') {
                document.write('image ' + i + ' with url : ' + item + ' is ');
                document.write('chosen');
                document.write('<br>');
            }
            else {
                document.write('image ' + i + ' with url : ' + item + ' is ');
                document.write('not chosen');
                document.write('<br>');
            }

        }
    }

событие onclick из html-файла:

<a href="#" onclick="javascript:selectedImages();">test</a>

или

<form action="#" method="post" onsubmit="javascript:selectedImages();">

и распечатка:

image 0 с URL: www ... / thumb2_on.jpg - CHOSEN

Answer 1

Это потому, что вы используете document.write после загрузки страницы.Он заменит текущую страницу новым контентом, поэтому, когда вы перейдете ко второй итерации в цикле, на странице больше не будет изображений.