LINUX.ORG.RU

В чем отличие объявлений скриптов text/javascript в разделах head и body документа ?


0

2

Хочу прикрутить к админке вот это http://www.malot.fr/bootstrap-datetimepicker/index.php
в тестовом примере

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <link href="./bootstrap/css/bootstrap.min.css" rel="stylesheet" media="screen">
    <link href="../css/bootstrap-datetimepicker.min.css" rel="stylesheet" media="screen">
</head>

<body>
<div class="container">
    <form action="" class="form-horizontal">
        <fieldset>
            <div class="control-group">
                <label class="control-label">DateTime Picking</label>
                <div class="controls input-append date form_datetime" data-date="1979-09-16T05:25:07Z" data-date-format="dd MM yyyy - HH:ii p" data-link-fi
eld="dtp_input1">
                    <input size="16" type="text" value="" readonly>
                    <span class="add-on"><i class="icon-remove"></i></span>
                                        <span class="add-on"><i class="icon-th"></i></span>
                </div>
                                <input type="hidden" id="dtp_input1" value="" /><br/>
            </div>
        </fieldset>
    </form>
</div>

<script type="text/javascript" src="./jquery/jquery-1.8.3.min.js" charset="UTF-8"></script>
<script type="text/javascript" src="./bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="../js/bootstrap-datetimepicker.js" charset="UTF-8"></script>
<script type="text/javascript" src="../js/locales/bootstrap-datetimepicker.fr.js" charset="UTF-8"></script>
<script type="text/javascript">
    $('.form_datetime').datetimepicker({
        //language:  'fr',
        weekStart: 1,
        todayBtn:  1,
                autoclose: 1,
                todayHighlight: 1,
                startView: 2,
                forceParse: 0,
        showMeridian: 1
    });
</script>

</body>
</html>

У меня в админке ссылки на скрипты заданы в разделе head в главном шаблоне сайта, а в примере ссылки на скрипты заданы в body причем сразу после div тега.

1. Вопрос в общем по html, скрипты заданные в body относятся только к div в котором этот календарь работает или ко всему документу и можно для каждого div задавать свои ссылки ? От чего зависит размещение js в разных частях документа
2. Админку я уже почти сделал, но сделал на bootstrap 2.3.2 и js прописаны в head, а календарик использует 2.2.2 версию и js прописаны после div. Как правильно сделать - перенести испольуемые календариком js в head после своих или оставить их после div ? Или заменить версию bootstrap для всего сайта?

★★★★
Ответ на: комментарий от orm-i-auga

ссылки на js как раз нужно перед закрытием в body, что бы не мешало рендеру документа, считается хорошей практикой которая ускоряет отрисовку страницы

umren ★★★★★
()
Ответ на: комментарий от umren

А что если вынести вообще за пределы документа, за </html>, в самый низ страницы? Я пробовал так, вроде все работает.

anonymous
()
Ответ на: комментарий от anonymous

в хроме то работает, а вот в других не факт, что все тип-топ будет, выносить за </html> ничего нельзя по спецификации, а кто-как это в движках реализует дело десятое, ну и толку вплане скорости тут всеравно нет, поэтому лучше так не делать.

umren ★★★★★
()
Ответ на: комментарий от orm-i-auga

js блокирует рендер страницы, как-раз в head стараются не пихать.

+ есть хаки по-типу async, специально для этого разработанные.

Так что давай, если ты не в теме топика, то и не будешь советовать, ок?

anonymous
()
8 мая 2014 г.

Ну в конце чтобы после загрузки страницы скрипт выполнялся, когда уже все элементы загружены. Только в чем смысл сейчас, когда есть функция $(document).ready(function())

DenisDangerous
()
Ответ на: комментарий от orm-i-auga

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

ddos3
()
Вы не можете добавлять комментарии в эту тему. Тема перемещена в архив.