Как и когда браузеры реализуют изменения DOM документа в реальном времени? - PullRequest
1 голос
/ 30 мая 2010

Мой сайт динамически встраивает внешний Javascript-файл в тег head. Внешний Javascript определяет глобальную переменную myString = "data". В какой момент myString становится доступным для Javascript на веб-сайте?

<html>
<head>
    <script type="text/javascript">
        myString = null;
        external = document.createElement("script");
        //externalScript.js is one line, containing the following:
        //myString = "data";
        external.setAttribute("src", "externalScript.js");
        external.setAttribute("type", "text/javascript");
        document.getElementsByTagName("head")[0].append(external);
        alert(myString);
    <script>
</head>
<body>
</body>
</html>

Этот код предупреждает ноль (когда я думал, что он предупредит "данные") в Chrome и IE, хотя DOM загрузил в externalScript.js на этом этапе. Когда externalScript.js действительно оценивается браузером и в какой момент у меня есть доступ к новому значению myString?

1 Ответ

4 голосов
/ 30 мая 2010

Вы можете получить к нему доступ, когда для этого элемента скрипта сработает событие onload, например:

external = document.createElement("script");
external.onload = function() { alert(myString); };
script.onreadystatechange= function () { //for IE, the special kid...
  if (this.readyState == 'complete') alert(myString);
}
external.setAttribute("src", "externalScript.js");
external.setAttribute("type", "text/javascript");
document.getElementsByTagName("head")[0].appendChild(external);

Это просто присоединяет функцию, запускаемую после загрузки скрипта, выполняет любой код, который зависит от скрипта, который там находится. Исправление к предыдущему ответу: как seanmonstar указывает в комментариях (спасибо!), Вам действительно нужно исключение IE и здесь, потому что оно немного «особенное» ...

...