Является ли DOM готовым, когда сценарий выполняется в дереве тела?

У меня есть отрезанный, который находится внутри ЛЮБОГО веб-сайта, в середине документа, как в середине статьи, а не внутри <head>. Этот скрипт загружает внешний скрипт в моем домене, добавляя тег <script> (в значительной степени похожий фрагмент Google Analytics).Является ли DOM готовым, когда сценарий выполняется в дереве тела?

Мои вопросы: если этот сценарий помещен внутри тела, DOM еще не разобран, поэтому я могу с уверенностью предположить, что могу манипулировать DOM, когда мой скрипт оценивается, не дожидаясь события DOMReady?

Я спрашиваю, потому что у меня большая задержка, когда мой скрипт начинает выполняться и когда происходит событие DOMReady (см. Коричневую полосу). Я использую этот DOMReady implementation

The хост Сайт

<html> 
 

 
<head> 
 
    ... 
 
</head> 
 

 
<body> 
 
    Website content 
 
    ... 
 
    <div> 
 
    
 
    <!-- Snippet --> 
 
    <div id="myContainer"></div> <!------(I should be able to query this div) --> 
 
    <script type="text/javascript"> 
 
    function() { 
 
     var ga = document.createElement('script'); 
 
     ga.type = 'text/javascript'; 
 
     ga.async = true; 
 
     ga.src = 'http://example.com/script.js'; 
 
     var s = document.getElementsByTagName('script')[0]; 
 
     s.parentNode.insertBefore(ga, s); 
 
    })(); 
 
    </script> 
 
    <!-- Snippet End --> 
 
    
 
    <div> 
 
    More content 
 
    ... 
 
</body> 
 
</html>

В example.com/script.js

(function(){ 
    //by this time div#myContainer should exist, right? 
    var div = document.getElementById('myContainer'); 
    div.innerHTML = "Hello World!"; 
})();

Некоторые соображения:

У меня нет контроля над страницы хоста, он может иметь что-либо внутри него.
Поддержка старых браузеров вызывает беспокойство.
Я должен как можно скорее добавить материал, я не могу дождаться таких вещей, как другие библиотеки, и изображения для завершения загрузки.
Он должен надежно работать каждый раз.

источник

2016-11-29 Vitim.us

Все элементы перед вашим первым элементом скрипта будут существовать уже. – CBroe

Единственная возможная проблема, которую я вижу, - это если ваш скрипт загружается до того, как загружаются тяжелые медиа-активы, такие как видео или большие изображения. Но если вы не после медиаданных, это не должно вызывать беспокойства. И все же, если вы нацеливаете известный селектор, вы все равно можете присоединить слушателей 'onload' к этим элементам. – Tyblitz

Да, это так. Если у вас есть тег скрипта в нижней части тела, то к моменту запуска вашего сценария все будет отображаться до этого.

У W3Schools есть хорошая статья на эту тему.

Сценарии в <head>

сценариев, которые будут выполняться, когда они называются, или при наступлении события, помещаются в функции. Поместите свои функции в раздел головы, таким образом, они все в одном месте, и они не мешают содержимому страницы.

Сценарии в <body>

Если вы не хотите, чтобы ваш скрипт для размещения внутри функции, или если ваш сценарий должен написать содержание страницы, он должен быть помещен в теле раздел.

источник

2016-11-29 22:05:32 Yaser

Является ли DOM готовым, когда сценарий выполняется в дереве тела?

ответ

Смежные вопросы