Попытка выполнить два файла JavaScript вместе с window.onload

Question

У меня есть два отдельных файла JavaScript, связанных с одним документом HTML, и когда я запускаю его, кажется, что второй файл JS переопределяет первый. Я думаю, что это связано с window.onload, вызываемым в каждом файле, но я не уверен, как обойти это.

Я пытался использовать window.onloadend для одного из файлов JS и window.onload для другого, но с теми же результатами, window.onloadend - единственный исполняемый файл.

file1.js

function init() {
    applyFunction();
    prefillForm();
    var applyForm = document.getElementById("applyForm");
    applyForm.onsubmit = validate;
}

window.onload = init;

file2.js

function init() {
    currentPage();
    timer();
}

window.onload = init;

Answer 1

Всякий раз, когда вы назначаете свойство on-, вы перезаписываете то, что ранее было прикреплено к этому свойству, и при возникновении события запускается только самый последний обработчик.Вместо этого используйте addEventListener:

window.addEventListener('load', init);

(поместите вместо строки .onload в обоих файлах)

Или, если у вас нет , у вас есть чтобы дождаться загрузки всего документа (включая такие вещи, как изображения), вы можете вместо этого прослушивать DOMContentLoaded, что сработает быстрее.DOM и все элементы будут заполнены, хотя не все ресурсы могли быть загружены:

window.addEventListener('DOMContentLoaded', init);

Answer 2

Или, в конце концов, вы можете переименовать Init функции, чтобы они не были уникальными, и в HTML вызвать анонимную функцию, которая вызывает их обе последовательно. А в HTML их называют:

load = () => {
   Init1();
   Init2();
}