Html 5 canvas getElementById（）返回null/未定义

代码如下：

HTML:

不支持画布元素

Javascript:

<script type="text/javascript">
    var canvas = document.getElementById('control');
    var context = canvas.getContext('2d');

    function draw(){
        context.font = "bold 12px sans-serif";
        context.fillText("x", 248, 43);
    }
</script>

var canvas=document.getElementById（'control'）；
var context=canvas.getContext（'2d'）；
函数绘图（）{
context.font=“bold 12px无衬线”；
上下文。填充文本（“x”，248，43）；
}

---

draw函数在GoogleMap初始化之后调用，所以DOM应该已经加载了，对吗？我可能做错了什么？

如果在

主体之前加载了
javascript
，那么画布将
未定义，因为浏览器尚未加载/渲染它。
调用
draw
-函数时，DOM已经加载，这是正确的

但是
var canvas=document.getElementById（'control'）-行在此之前进行求值，因为它不在
draw
-函数中。在呈现元素之前，它会立即在文档的
中执行

我建议您将init函数更改为类似的函数

var canvas,context;
function initializeMap() {
   canvas = document.getElementById('control');
   context = canvas.getContext('2d');
}

它在标签上，但函数被调用。它不应该正常工作吗？有什么例子吗？我没有看到函数，我设置了一个变量setter
var canvas=doucment.get…（'control'）当浏览器在头部运行javascript时，没有文档。javascript在上声明，但在加载文档后调用函数draw（），这很好。可能会重复
var canvas,context;
function initializeMap() {
   canvas = document.getElementById('control');
   context = canvas.getContext('2d');
}