А смысл? Это не удобно и нелепо

Реализуй роутинг на js, для каждой страницы отдельный модуль-компонент и вперед... Такой себе самодельный мини-React... На ютубе полно уроков по теме.

Можно div-ами оперировать, особенно если не нужна прокрутка.

  
 
 
     
     
     
     
 
 
 
 
 
 
 
 
    
О нас
 
    
Наша компания занимается чем-то удивительным.
 
 
 
 
 
    
Контакты
 
    
Свяжитесь с нами по адресу: example@example.com
 
 
 
 
 
 
 
 
 
 

Для реализации многостраничного вида на одностраничном сайте (SPA) с использованием JavaScript, вам понадобится следующий подход:

1. **Разметка HTML:** Ваш HTML-файл должен содержать различные секции для каждой "страницы" (например, домашняя страница, о нас, контакты и т.д.). Эти секции могут быть реализованы как `<div>` элементы с уникальными идентификаторами.

```html
<div id="home">...</div>
<div id="about" style="display:none;">...</div>
<div id="contact" style="display:none;">...</div>
```

2. **Навигация:** Добавьте элементы навигации, такие как ссылки или кнопки, которые будут переключать отображение между разными секциями.

```html
<nav>
<a href="#home">Домой</a>
<a href="#about">О нас</a>
<a href="#contact">Контакты</a>
</nav>
```

3. **JavaScript для управления отображением:** Используйте JavaScript для прослушивания событий изменения хеша URL (или кликов по ссылкам) и переключения видимости различных секций.

```javascript
function navigate() {
// Скрываем все секции
document.querySelectorAll('div[id]').forEach(div => {
div.style.display = 'none';
});

// Отображаем нужную секцию
const hash = window.location.hash || '#home';
document.querySelector(hash).style.display = 'block';
}

// Прослушиваем изменения хеша
window.addEventListener('hashchange', navigate);

// Вызываем функцию навигации при инициализации
navigate();
```

4. **Стилизация:** Используйте CSS для стилизации видимых и скрытых секций, а также для оформления элементов навигации.

5. **(Необязательно) Использование History API:** Если вы хотите улучшить пользовательский опыт и SEO, можете использовать History API для изменения URL без перезагрузки страницы.

Этот подход позволит вам имитировать многостраничный сайт, используя один HTML-файл и динамически изменяя отображаемое содержимое с помощью JavaScript.

Нет. Так низя делать, раньше я себе также представлял. Нужно запрашивать с сервера страницу, и рендерить ее в body. Потом меняем url без перезагрузки страницы используя history. А можно просто использовать реакт с react-router-dom