Как узнать, когда доступен элемент «тело» DOM?

Как только body Доступ к узлу DOM, я хотел бы добавить к нему класс с JavaScript.
Я хочу, чтобы это произошло как можно скорее, перед тем, как будут загружены дети из body.Как узнать, когда доступен элемент «тело» DOM?

Прямо сейчас, я использую встроенный скрипт сразу после открытия тега body. Есть ли менее навязчивый способ?

источник

2012-02-28 Dan Abramov

body.onload = function() {...}? – user544262772

Ожидает ли событие body.onload, чтобы дети были загружены? – supertopi

Зачем вам это нужно? – qwertymk

Я бы предположил, что это будет отличаться между браузерами.

Одно из решений может заключаться в том, чтобы протестировать его, разместив скрипт сразу в теге открытия <body>, а затем запустив код с интервалом, чтобы добавить класс.

<body> 
    <script> 
    function add_class() { 
     if(document.body) 
      document.body.className = 'some_class'; 
     else 
      setTimeout(add_class, 10); // keep trying until body is available 
    } 
    add_class(); 
    </script> 

    <!-- rest of your elements--> 
</body>

JQuery делает нечто подобное внутренне для решения конкретной IE ошибка.

Нет гарантии, что элементы-потомки не будут загружены, так как снова это будет зависеть от того, когда конкретная реализация сделает доступным body.

Here's the source где JQuery схожий подход, проверка на существование body в главном jQuery.ready обработчиком, и повторно вызывая jQuery.ready через setTimeout если body не доступен.

И here's an example, чтобы увидеть, может ли ваш браузер видеть элемент <body> в скрипте в верхней части элемента перед другими элементами. (Открыть консоль)

Here's the same example без необходимости в консоли.

источник

2012-02-28 18:59:43

jQuery совсем не похож. – jAndy

@jAndy: Да, в конкретном случае обойти ошибку IE, где он показывает DOM, готовый без 'body', фактически доступного. –

@jAndy: [Вот источник] (https://github.com/jquery/jquery/blob/1.7.1/src/core.js#L401-403) –

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

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

var script = document.createElement('script'); 
    script.src = '//localhost:4000/app.js'; 
    (function appendScript() { 
    if (document.body) return document.body.appendChild(script); 
    window.requestAnimationFrame(appendScript); 
    })();

источник

2016-11-20 03:22:00

Как узнать, когда доступен элемент «тело» DOM?

ответ

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