Django и JavaScript: document.getElementById return always Uncaught TypeError: Cannot set properties of null (setting 'innerHtml')

Я пишу вам, потому что я застрял на базовой операции (почти стыдно). Я работаю над проектом Django и вот что я пытаюсь сделать: показать внутри двух тегов 'span' длину списка. Я делаю это уже не в первый раз и у меня всегда получалось. Но теперь я не понимаю, почему это не работает. Вот код:

Мой index.html:

Мой js (называемый templatesList.js ) файл:

const templatesList = [
    'arsha',
    'digimedia',
    'firstPortfolio',
    'leadership-event',
    'medicio'
];


document.addEventListener('DOMContentLoaded', function () {
    const totalTemplatesLg = document.getElementById('total-templates-lg');
    const totalTemplatesSm = document.getElementById('total-templates-sm');

    totalTemplatesLg.innerHtml = `${templatesList.length}`;
    totalTemplatesSm.innerHtml = `${templatesList.length}`;
})

Я перепробовал их все.

Я попробовал переместить скрипт в нижнюю часть html файла, также удалив событие 'DomContentLoaded'.

Я также попробовал заменить id на 'class' в обоих тегах 'span' и создать цикл for. Я также пробовал использовать цикл forEach. Я также пробовал использовать 'Array.from' и снова использовать цикл. Но ничего из этого не работает. Я всегда получаю одну и ту же ошибку, а именно: Uncaught TypeError: Cannot set properties of null (setting 'innerHtml') at HTMLDocument.<anonymous>

Вернуться на верх