Как сделать onload для всех страниц сайта?

Question

rinaz22 @rinaz22

Как сделать onload для всех страниц сайта?

Всем привет. Хочу сделать заглушку для сайта, но очень много страниц. Обычные html страницы.
Как разом можно сделать onload для всех страниц, чтобы не установить код вручную на все страницы?
Можно ли как-то через js это сделать?

Вопрос задан более трёх лет назад
45 просмотров

Комментировать

Подписаться 1 Простой Комментировать

Помогут разобраться в теме Все курсы

Skillbox

JavaScript

3 месяца

Далее
Яндекс Практикум

Фронтенд-разработчик расширенный

13 месяцев

Далее
Академия Eduson

Fullstack-разработчик на JavaScript

11 месяцев

Далее

Пригласить эксперта

Ответы на вопрос 1

6 комментариев

rinaz22 @rinaz22 Автор вопроса

А как сделать заглушку

Написано более трёх лет назад

Vitaliy Orlov @orlov0562

1. Создай скрипт script.js с таким содержимым

let body = document.getElementsByTagName('body')[0];
body.style.display = 'none';
document.addEventListener('DOMContentLoaded', function(){ 
    body.innerHTML = 'заглушка';
    body.style.display = 'block';
}, false);

2. в html файлы помести его в секции head

..
<head>
...
<script src="script.js"></script>
</head>

Написано более трёх лет назад

rinaz22 @rinaz22 Автор вопроса

Vitaliy Orlov, а что за файл stub.html?

Написано более трёх лет назад
Vitaliy Orlov @orlov0562

stub.html - файл заглушка, который будет отображаться при любых запросах. Т.е. например у тебя есть такие файлы:
- index.html
- about.html
- contact.html
- stub.html

если ты добавишь туда файл .htaccess с содержимым указанным выше, то при запросах к любому url:
- site.com/index.html
- site.com/about.html
- site.com/contact.html
- site.com/stub.html

у тебя будет отображаться stub.html

Написано более трёх лет назад
rinaz22 @rinaz22 Автор вопроса

Vitaliy Orlov, так мне нужна заглушка, чтобы скрыть контент пока сайт полностью не загрузиться. Т.е. onload

Написано более трёх лет назад

Vitaliy Orlov @orlov0562

rinaz22, я за другую заглушку подумал, по типу "Сайт временно не доступен, приходите позже".

Твое решение будет выглядеть так
script.js

let body = document.getElementsByTagName('body')[0];
let stub = document.createElement('div');
stub.innerHTML = 'Загрузка..';
stub.style.position = 'fixed';
stub.style.width = '100%';
stub.style.height = '100%';
stub.style.top = 0;
stub.style.left = 0;
stub.style.backgroundColor = "black";
stub.style.color = "white";
body.appendChild(stub);
document.addEventListener('DOMContentLoaded', ()=>{ 
    stub.style.display = 'none';
}, false);

во все html в body надо добавить

...
<body>
<script src="script.js">
...

Вот все в одном файле для теста + setTimeout, чтобы имитировать загрузку

<!doctype html>
<html>
    <body>
        <script>
            let body = document.getElementsByTagName('body')[0];
            let stub = document.createElement('div');
            stub.innerHTML = 'Загрузка..';
            stub.style.position = 'fixed';
            stub.style.width = '100%';
            stub.style.height = '100%';
            stub.style.top = 0;
            stub.style.left = 0;
            stub.style.backgroundColor = "black";
            stub.style.color = "white";
            body.appendChild(stub);
            document.addEventListener('DOMContentLoaded', ()=>{ 
                setTimeout(()=>{
                    stub.style.display = 'none';
                }, 1000);
            }, false);            
        </script>
        <p>Контент сайта</p>
    </body>
</html>

Написано более трёх лет назад

Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы

JavaScript

+2 ещё

Средний
Как можно реализовать что то вроде селекта внутри родителя у которого есть скрытые элементы и должна быть горизонтальная прокрутка?
- 1 подписчик
- 16 часов назад
- 72 просмотра
0

ответов
JavaScript

+1 ещё

Простой
Как идентифицировать проксированные ошибки?
- 1 подписчик
- 05 дек.
- 116 просмотров
1

ответ
JavaScript

+2 ещё

Простой
Как сделать резкое переключение слайдов?
- 1 подписчик
- 03 дек.
- 152 просмотра
0

ответов
JavaScript

Простой
Как сделать чтоб условия не перезаписывались?
- 1 подписчик
- 02 дек.
- 214 просмотров
1

ответ
JavaScript

+2 ещё

Простой
Элемент стилизации на js, как сделать чтобы не было резкой смены картинки фона?
- 1 подписчик
- 27 нояб.
- 211 просмотров
1

ответ
JavaScript

Простой
Переход по ссылке с параметром на конкретный узел в vis.js?
- 1 подписчик
- 24 нояб.
- 118 просмотров
0

ответов
JavaScript

+1 ещё

Простой
Как сделать сложную виртуализацию?
- 1 подписчик
- 22 нояб.
- 286 просмотров
2

ответа
HTML

+1 ещё

Средний
В какую сторону копать решение чтобы решить проблему с наложением?
- 1 подписчик
- 22 нояб.
- 141 просмотр
0

ответов
HTML

+1 ещё

Простой
Как растянуть вложенный блок внутри других блоков на максимальную длину, но не более чем на ширину страницы?
- 1 подписчик
- 21 нояб.
- 142 просмотра
0

ответов
JavaScript

Простой
В цикле for много кнопок как сделать .addEventListener('click', к каждой кнопке?
- 1 подписчик
- 16 нояб.
- 316 просмотров
3

ответа
Показать ещё Загружается…

Fullstack JavaScript разработчик

MakeDifference

от 60 000 до 110 000 ₽

Frontend-разработчик (Vanilla JS, high-load media platform)

Karma8

от 200 000 до 300 000 ₽

Fullstack-разработчик

IT-hunter • Санкт-Петербург

До 300 000 ₽

Answer 1 · 2019-02-05 16:14:35

Если у тебя много именно html файлов, то можно вынести js код в отдельный файл, например script.js и там прописать нужный код. Но, при этом потребуется во всех файлах подключить, этот script.js

(function() {
    console.log('loaded');
})();

Если тебе надо просто сделать заглушку и у тебя apache, то проще всего создать файл .htaccess с таким содержимым

RewriteEngine On
RewriteCond %{ENV:REDIRECT_STATUS} !=503
RewriteRule ^ stub.html [L, R=503]

Как сделать onload для всех страниц сайта?

Войдите, чтобы написать ответ

Минуточку внимания

Войдите на сайт