Приведет ли проблема к связыванию файлов javascript в теле, а не в заголовке? - PullRequest
Новая
       16

Приведет ли проблема к связыванию файлов javascript в теле, а не в заголовке?

3 голосов
/ 27 июля 2011

это то, что я пытаюсь сделать 

<script type="text/javascript" src="resources/application.js"></script>
    <script type="text/javascript" >
       $(document).ready(createHeader()); 
       $(document).ready(scriptSet()); 
    </script>

я хотел бы избежать необходимости разделять их, и хотя обычно я вижу ссылки на скрипты только внутри заголовка документа. Кажется, функции не работают, когда их помещают туда. Тем не менее, кажется, что все работает совершенно нормально, когда находится на конце тела, так что это может вызвать проблемы, или это нормально?

Ответы [ 6 ]

8 голосов
/ 27 июля 2011

Функционально, пока вы заключаете свой код в $(document).ready(function(){ }); и , он приходит после файла jQuery, он не имеет значение, если он в head или body. $(document).ready гарантирует, что DOM полностью загружен перед выполнением любого сценария.

ОДНАКО , размещение всех ваших сценариев включает в себя и сценарии в нижней части body это лучший для загрузки производительности.

В этой статье это хорошо объясняется.

Пример: 

        <body>

    <!-- MY HTML CODE -->

    <!-- START javascript -->
        <script type="text/javascript" src="/javascript/jquery/jquery-1.6.2.min.js"></script>
        <script type="text/javascript" src="/javascript/jquery/plugins/jquery.random_plugin.js"></script>
        <script type="text/javascript" src="/javascript/jquery/plugins/jquery.random_plugin2.js"></script>
        <script type="text/javascript" src="/javascript/some_other_scripts.js"></script>

        <script type="text/javascript" language="JavaScript">
        //<![CDATA[
            $(document).ready(function(){
                // my code
            });
        //]]>
        </script>
    <!-- END javascript -->

        </body>
1 голос
/ 27 июля 2011

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

0 голосов
/ 27 июля 2011

Как правило, не имеет значения, помещаете ли вы свой скрипт и блоки в свой элемент BODY;они будут работать отлично в большинстве случаев.Некоторые люди считают это плохой практикой, но это не неправильная практика.Это происходит постоянно.

Тем не менее, я хотел бы отметить, что не имеет значения, куда вы положили вызов функции $.ready(), до тех пор, пока это происходит после включения jQuery, так как он всегда будет работатьПОСЛЕ того, как DOM готов (что произойдет ПОСЛЕ загрузки страницы).Таким образом, в этом случае это не имеет никакого значения.

Обратите внимание на анонимную функцию в вызове функции.Это передает ссылку на $.ready() для анонимной функции, что позволяет выполнять тело ее функции в более позднее время, поэтому ваши функции будут вызываться позднее. 

<script type="text/javascript">
$(document).ready(function(){
    createHeader(); 
    scriptSet();
}); 
</script>
0 голосов
/ 27 июля 2011

Я развернул несколько веб-приложений, и у меня никогда не было проблем со сценарием в теге body.Мне нравится размещать его в конце страницы, чтобы не мешать процессу загрузки видимых элементов на странице.Я полагаю, что Google также сделал это с некоторыми из своих скриптов (может быть, Analytics?).

Как и некоторые другие сказали, убедитесь, что у вас есть ссылка на jQuery до $ (document) .ready ();вызов.Легко проскользнуть мимо и трудно устранить неполадки:)

JMax

0 голосов
/ 27 июля 2011

Вы понимаете, что функции, которые вы поместили в $(document).ready(), не будут ждать запуска DOMContentLoaded?Вы должны заключить их в вызов функции (обработчик событий), чтобы избежать их немедленного вызова, когда они появляются в коде.Анонимная функция обычно просто отлично. 

$(document).ready(function(){
    createHeader();
    scriptSet();
});
0 голосов
/ 27 июля 2011

Нет, на самом деле, это полезно для "производительности", чтобы поместить ваши скрипты в конец вашего HTML.

Тем не менее, хорошей практикой является размещение всего вашего javascript в другом файле и просто установка заголовка, вызывающего его, если возможно даже сжатие файла.

Теперь я бы изменил этот код для этого 

$(document).ready(function(){
    createHeader();
    scriptSet();
});

, чтобы вы не вызывали $ (document) .ready дважды:)

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...