Вопрос по JavaScript - PullRequest
       2

Вопрос по JavaScript

1 голос
/ 08 октября 2010

Можно не показывать html-страницу в браузере пользователя до тех пор, пока не будет загружен и выполнен некоторый JavaScript (встроенный или в отдельном файле) (для манипулирования страницей DOM)?

Ответы [ 6 ]

4 голосов
/ 08 октября 2010

Самое простое, что нужно сделать, это установить переменную css

display: none;

на всю страницу.затем, когда все загружено, вы можете установить отображение на

display: block; // or something else that suits.

Если вы убедитесь, что фрагмент CSS загружен в самом начале вашего документа, он будет активен до показа любого html.

если вы используете библиотеку javascript, такую ​​как jQuery, у вас будет доступ к функции $ (document) .ready (), и вы сможете реализовать переключение следующим образом:

<html>
    <head>
        <title>test</title>
        <style type="text/css">
            body > div {
                display: none;
            }
        </style>
        <script type="text/javascript">
            $(document).ready(function() {
                $('body > div').css('display', 'block');
            });
    </head>
    <body>
        <div>
            This will initially be hidden.
        </div>
    </body>
</html>
3 голосов
/ 08 октября 2010

Не так, как вы бы распространяли страницу. Браузеры (обычно) начинают отображать фрагменты базового HTML-файла по мере его поступления.

Конечно, вы можете смоделировать это, генерируя весь HTML на лету из некоторого включенного файла Javascript. Но это не похоже на хороший план, поскольку он ухудшит ужасно для людей без JS, или если у вас есть небольшая ошибка в вашем скрипте. Лучшим вариантом может быть присвоение тегу body стиля display: none и изменение его стиля из сценария, чтобы некоторые части снова стали видимыми.

Чего вы на самом деле пытаетесь достичь? Похоже, что есть лучший способ сделать это ...

1 голос
/ 08 октября 2010

Примеры того, что вы можете сделать:

  1. BigPipe от Facebook: http://www.facebook.com/notes/facebook-engineering/bigpipe-pipelining-web-pages-for-high-performance/389414033919 Этот метод позволяет вам сначала загрузить JS, а затем ASYNC + внедрить весь контент DOM.
  2. GMail
  3. Zimbra (веб-приложение с открытым исходным кодом, похожее на MS Outlook / Exchange)
1 голос
/ 08 октября 2010

Поместите содержимое HTML-страницы в DIV, сделайте так, чтобы ее воспроизведение не выполнялось, а при загрузке тела загрузите ее.

<script type="text/javascript">

function showContent() { 
var divBody=document.getElementById('divBody');
divBody.style.display= 'block';
} 
</script> 
<body onload="showContent()"> 
<div id="divBody" style="display: none;">
 <--HTML of the page--> 
</div>  
</body>
0 голосов
/ 24 января 2016

Все, что вам действительно нужно сделать, это дать вашему элементу ID или CLASS и использовать дисплей: нет;имущество.Когда вы будете готовы показать его, просто удалите его.

CSS:

#div_1 {
            display: none;
        }

HTML:

<div id="div_1">
        <p>This will be the hidden DIV element until you choose to display it.</p>
        <p id="js_1"></p>
        <script>
            var x = "Some Test ";
            var y = "Javascript";
            document.getElementById("js_1").innerHTML = x + y;    
        </script>
    </div>
0 голосов
/ 25 сентября 2013

Насколько я понимаю, вы хотите запустить некоторый код JavaScript перед загрузкой страницы.В файле js вы пишете свою функцию инициализации и добавляете EventListener в окно при событии «load».Это обеспечит выполнение кода инициализации вначале, а затем вы сможете начать отображение содержимого HTML.

var Yourdomain = {};
YourDomain.initPage = function(){
 /* Your init code goes here*/
}

window.addEventListener("load", YourDomain.initPage, false);
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...