Страницы Github получают ошибку 404 при использовании JavaScript для загрузки html ⇐ CSS

[Anonymous]

Изображения ошибок.
Я недавно работал над своим веб-сайтом, однако с тех пор, как я начал использовать JavaScript, чтобы попытаться наследовать панель навигации и нижний колонтитул каждой страницы, я получал ошибку 404.
Когда страница загружается, предполагается, что загружаются Navbar.html и Footer.html из папки компонентов. JavaScript или scripts.js извлекут Navbar.html и нижний колонтитул, однако вернут ошибку.

Код: Выделить всё

ErrorLog

components/footer.html:1

Failed to load resource: the server responded with a status of 404 ()
scripts.js:13 Error: Error: Failed to load footer
at scripts.js:5:19
(anonymous) @ scripts.js:13

components/navbar.html:1

Failed to load resource: the server responded with a status of 404 ()
scripts.js:28 Error: Error: Failed to load navbar
at scripts.js:20:19
(anonymous) @ scripts.js:28

Код: Выделить всё

// script.js
// Load footer from footer.html
fetch('../../components/footer.html')
.then(response => {
if (!response.ok) {
throw new Error('Failed to load footer');
}
return response.text();
})
.then(data => {
document.getElementById('footer-placeholder').innerHTML = data;
})
.catch(error => {
console.error('Error:', error);
});

// Load navbar from navbar.html
fetch('../../components/navbar.html')
.then(response => {
if (!response.ok) {
throw new Error('Failed to load navbar');
}
return response.text();
})
.then(data => {
document.getElementById('navbar-placeholder').innerHTML = data;
})
.catch(error => {
console.error('Error:', error);
});

Код: Выделить всё

// index.html within body tag








// Scripts

Код: Выделить всё

Portfolio-Website/
├── .gitattributes
├── .gitignore
├── index.html
├── README.md
├── .git/
├── .vs/
├── assets/
│   ├── css/
│   │   └── style.css
│   ├── images/
│   │   ├── Graduate/
│   │   │   └── graduate.png
│   │   ├── movielist/
│   │   │   └── movielist.png
│   │   └── resume/
│   │       └── IMG_1301.jpg
│   └── js/
│       └── scripts.js
├── components/
│   ├── footer.html
│   └── navbar.html
├── pages/
│   ├── about.html
│   ├── contact.html
│   ├── graduation-invite.html
│   ├── movie-ranking.html
│   └── resume.html

Репозиторий: https://github.com/Francefernance12/Por ... ebsite.git
Веб-сайт: https://francefernance12.github.io /Portfolio-Website/
Я пытался изменить относительные пути различными способами, использовать обработку ошибок в файле JS с помощью инструментов разработчика веб-сайтов и даже использовать AIchatgpt, чтобы проверить, мой код Javascript был правильным. Это привело к той же ошибке выборки. Я не уверен, проблема ли это в хостинге страниц GitHub или в моих кодах.

Подробнее здесь: https://stackoverflow.com/questions/791 ... -load-html