Логотип Хекслета
/
Вопросы и ответы
/
JavaScript
/

как динамически добавлять script с помощью document write в javascript

как динамически добавлять script с помощью document write в javascript

JavaScript
JS

год назад

Nikolai Gagarinov

Присоединяйтесь к нашему Telegram-сообществу

Ответы

0

При использовании document.write, вы можете добавить JavaScript на страницу следующим образом:

document.write('<script src="URL_вашего_скрипта.js"><\/script>');

Обратите внимание на символ \/, который используется для экранирования символа /, чтобы document.write не завершил тег <script> до его окончания:

document.write('<script src="https://example.com/script.js"><\/script>');

Тем не менее, вызов document.write после загрузки страницы приведет к удалению содержимого page или вызовет ошибку, так как этот метод 'перезаписывает' содержимое документа.

Лучше намного более безопасным и современным способом добавления скрипта является создание элемента <script> и добавление его в документ:

function loadScript(url, callback) {
    const script = document.createElement('script'); // Создаем элемент <script>
    script.type = 'text/javascript'; // Устанавливаем тип

    if (script.readyState) { // Для IE
        script.onreadystatechange = function () {
            if (script.readyState === 'loaded' || script.readyState === 'complete') {
                script.onreadystatechange = null;
                callback(); // Вызов функции после загрузки скрипта
            }
        };
    } else { // Для остальных браузеров
        script.onload = function () {
            callback(); // Вызов функции после загрузки скрипта
        };
    }

    script.src = url; // Устанавливаем источник скрипта
    document.head.appendChild(script); // Добавляем скрипт в <head> или <body>
}

// Использование функции
loadScript('https://example.com/script.js', function() {
    console.log('Скрипт загружен и готов к использованию!');
});

Вызывая document.write, вы можете навредить произвольному состоянию DOM. Создание элемента <script> и его добавление не приведет к повреждениям.

Используя обработчики событий onload, вы можете выполнять действия после полной загрузки скрипта.

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

год назад

Ivan Gagarinov

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