Загрузить внешний скрипт после завершения загрузки страницы с помощью $(document).ready() и $.getScript()

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

Краткий пример/моя попытка будет такой:

Файл HTML:

<!DOCTYPE html>
<html lang = "en">
<head>
    <meta charset = "UTF-8">
    <title></title>
    <script src = "js/jquery-3.3.1.js">
        $(document).ready( function () {
            $.getScript("./js/script.js");
        } );
    </script>
   </head>
<body>
    <p id = "para">hey there waht's up</p>
<body>
</html>

Внешний файл JS:

$("#para").click( function () {
    $("#para").hide();
})

Но это не работает. Есть идеи, почему? Я гоняюсь за единорогами?

<script src = "js/jquery-3.3.1.js"></script> <script>         $(document).ready( function () {             $.getScript("./js/script.js");         } );     </script>

— 08.04.2019 13:10

javascript jquery html external

08.04.2019 13:08

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией

В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.

Концепция локализации и ее применение в приложениях React ⚡️

Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer

В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...

Безумие обратных вызовов в javascript [JS]

Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...

Система управления парковками с использованием HTML, CSS и JavaScript

Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...

JavaScript Вопросы с множественным выбором и ответы

Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...

Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Согласно документация MDN:

If a script element has a src attribute specified, it should not have a script embedded inside its tags.

Поэтому переместите код в отдельный тег script.

<script src = "js/jquery-3.3.1.js"></script> 
<script> 
    $(document).ready( function () { $.getScript("./js/script.js"); } );
</script>

Спасибо за ответ. Я сделал то, что вы предложили, но это все еще не работает. Так что просто чтобы проверить, что у меня нет ошибок в коде, я добавил импорт скрипта внизу раздела body, и это сработало. Что-то еще, что я мог пропустить?

— 08.04.2019 13:18

jquery-3.3.1.js:9600 Access to XMLHttpRequest at 'file:///home/deus/Projects/web/test_jquery/js/script.js?_=1‌554722417976' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.

Думаю, $.getScript не работает для локальных файлов.

— 08.04.2019 13:22

@DeusDeceit : stackoverflow.com/questions/20041656/…

— 08.04.2019 13:24

Да, когда обслуживается через apache, это работает. Большое спасибо за Вашу помощь.

— 08.04.2019 13:28

@DeusDeceit: рад, что помог :)

— 08.04.2019 13:28

Давайте продолжить обсуждение в чате.

— 08.04.2019 13:42

08.04.2019 13:11