Javascript не может найти элемент по id?

<html>
<head>
    <title>Test javascript</title>

    <script type="text/javascript">
        var e = document.getElementById("db_info");
        e.innerHTML='Found you';
    </script>
</head>
<body>
    <div id="content">
        <div id="tables">

        </div>        
        <div id="db_info">
        </div>
    </div>
</body>
</html>

Если я использую alert(e);, он отображает null.... и, очевидно, я не получаю никаких "найденных вами" на экране. Что я делаю неправильно?

Ответ 1

Проблема заключается в том, что вы пытаетесь получить доступ к элементу до его существования. Вам нужно дождаться, когда страница будет полностью загружена. Возможным подходом является использование обработчика onload:

window.onload = function () {
    var e = document.getElementById("db_info");
    e.innerHTML='Found you';
};

Большинство распространенных библиотек JavaScript предоставляют событие DOM-ready. Это лучше, так как window.onload ждет всех изображений. Вам это не нужно в большинстве случаев.

Другой подход заключается в том, чтобы поместить тег script прямо перед вашим закрывающим </body> -tag, поскольку все перед ним загружается во время выполнения, затем.

Ответ 2

Запустите код либо в событии onload, либо непосредственно перед тем, как закрыть тег body. Вы пытаетесь найти элемент, которого нет в данный момент, когда вы это делаете.

Ответ 3

Как браузер узнает, когда запускать код внутри тега script? Таким образом, чтобы запустить код после полного загрузки окна,

window.onload = doStuff;

function doStuff() {
    var e = document.getElementById("db_info");
    e.innerHTML='Found you';
}

Другой альтернативой является сохранение <script...</script> непосредственно перед закрывающим тегом </body>.

Ответ 4

Script вызывается до того, как существует элемент.

Вы должны попробовать одно из следующих действий:

обернуть код в функцию и использовать событие onload для тела, чтобы вызвать его.
поместите script в конец документа
использовать атрибут defer в объявлении тега script

Ответ 5

script выполняется до создания DOM тела. Поместите все это в функцию и вызовите ее из onload элемента body.