Сценарий внедрения тега с синхронным выполнением - PullRequest
Новая
       15

Сценарий внедрения тега с синхронным выполнением

0 голосов
/ 20 мая 2019

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

<html>
    <head>
        <title>Injecting Script Tags</title>
    </head>
    <body>
        <h1>Injecting Script Tags</h1>

        <script>
            console.log('starting');
            var newScriptTag = document.createElement('script');
            newScriptTag.src = 'https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.js';
            newScriptTag.type = 'text/javascript';
            document.head.appendChild(newScriptTag);
            try {
                var now = moment().format('HH:mm');
                console.log(`moment loaded.  The time is ${now}`);
            } catch (e) {
                console.log(`Moment not loaded: ${e}`);
            }
        </script>
    </body>
</html>

Как показывает приведенный выше фрагмент, moment() недоступен в операторе после вставки тега.

Я думаю это можно сделать с помощью eval(...), но этот вариант не популярен.

1 Ответ

0 голосов
/ 20 мая 2019

использовать событие onload 

<html>
    <head>
        <title>Injecting Script Tags</title>
    </head>
    <body>
        <h1>Injecting Script Tags</h1>

        <script>
            console.log('starting');
            var newScriptTag = document.createElement('script');
            newScriptTag.src = 'https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.js';
            newScriptTag.type = 'text/javascript';
            newScriptTag.onload = function(){
                try {
                    var now = moment().format('HH:mm');
                    console.log(`moment loaded.  The time is ${now}`);
                } catch (e) {
                    console.log(`Moment not loaded: ${e}`);
                }

            };
            document.head.appendChild(newScriptTag);
            
        </script>
    </body>
</html>
...