Файл Javascript (excanvas) не работает, когда я загружаю его внизу страницы

Это работает:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>

  <script src="/js/msgv/widgets/excanvas2.js" type="text/javascript"></script>
  <script type="text/javascript" charset="utf-8">
    function canvasTest(){
      console.log("beginning canvasTest");
      var b_canvas = document.getElementById("regularCanvas");
      var b_context = b_canvas.getContext("2d");
      b_context.fillRect(50, 25, 150, 100);
    }
  </script>

</head>

<body onLoad="canvasTest()">
    <canvas id="regularCanvas" style="border: 1px dotted; float: left;" class="clear" height="225" width="300"></canvas>
</body>
</html>

Это не:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>

Единственная разница между ними заключается в том, где я загружаю их на странице. Все отлично работает, когда я загружаю в голову excanvas. Я получаю сообщение об ошибке при загрузке в нижней части тела.

  <script type="text/javascript" charset="utf-8">
    function canvasTest(){
      console.log("beginning canvasTest");
      var b_canvas = document.getElementById("regularCanvas");
      var b_context = b_canvas.getContext("2d");
      b_context.fillRect(50, 25, 150, 100);
    }
  </script>

</head>

<body onLoad="canvasTest()">
    <canvas id="regularCanvas" style="border: 1px dotted; float: left;" class="clear" height="225" width="300"></canvas>
  <script src="/js/msgv/widgets/excanvas2.js" type="text/javascript"></script>
</body>
</html>
Источник

2 ответа

Решение

RTFM:

Файл excanvas.js должен быть включен на страницу до появления элементов canvas в разметке. Это связано с ограничениями в IE, и мы должны сделать свою магию, прежде чем IE увидит любой экземпляр в разметке. Рекомендуется положить его в голову.

Источник

Если вы хотите загрузить excanvas асинхронно / условно, это возможно: /questions/22242714/excanvasjs-ne-rabotaet-na-ie-s-dinamicheskim-skriptom-zagruzki/22242726#22242726

Источник
Другие вопросы по тегам