Сбой Raphael JS

#javascript #raphael

#javascript #рафаэль

Вопрос:

Следующий, очень простой сценарий, завершается сбоем в Chrome и Safari с этой ошибкой Cannot call method 'appendChild' of null

 <!DOCTYPE html>
<html lang="en">
    <head>
        <script type="text/javascript" src="raphael-min.js">
        </script>

        <script type="text/javascript">

            var paper = Raphael("canvas", 320, 200);

        </script>
    </head> 
    <body>
        <div id="canvas"></div>
    </body>
</html>
 

Я понятия не имею, почему — кто-нибудь?

Комментарии:

1. Можете ли вы перефразировать заголовок как вопрос или быть более конкретным (например, добавить сообщение об ошибке)?

2. @MichaelPaulukonis — он уже опубликовал сообщение об ошибке

Ответ №1:

Вы должны завершить вызов, когда DOM будет готов.

 <script type="text/javascript">
// Using JQuery

$(function() {
    var paper = Raphael("canvas", 320, 200);
});
</script>
 

Комментарии:

1. Я, конечно, должен! Я только что понял это. Об этом нигде не говорится в документах — я должен это знать на самом деле — но это должно быть в документах!

2. ну, в примерах это есть. плюс — просто подумайте — я получаю доступ к dom?

3. Практически любая функция javascript, которая работает с существующим элементом dom, завершится ошибкой, если вы вызовете ее перед созданием элемента dom.

Ответ №2:

Или просто вызовите функцию после того, как вы определили div…

 <!DOCTYPE html>
<html lang="en">
    <head>
        <script type="text/javascript" src="raphael-min.js">
        </script>
    </head> 
    <body>
        <div id="canvas"></div>
        <script type="text/javascript">var paper = Raphael("canvas", 320, 200);</script>
    </body>
</html>