无法调用 null 的方法“appendChild”答案

【问题标题】：Cannot call method 'appendChild' of null无法调用 null 的方法“appendChild”
【发布时间】：2013-12-12 19:23:41
【问题描述】：

我需要一些帮助来解决我的问题；似乎 Chrome 不喜欢运行此代码，但在 Firefox 上它可以工作：

function createContext(width, height) {
    var canvas = document.createElement('canvas');
    canvas.id = "1";
    canvas.width = width;
    canvas.height = height;
    document.body.appendChild(canvas);
    return canvas.getContext('2d');
}

【问题讨论】：

它在我的 chrome 控制台中运行良好，尝试在 DOM 准备好后运行您的代码
可能重复 stackoverflow.com/questions/8670530/… stackoverflow.com/questions/19086159/… stackoverflow.com/questions/14946428/… stackoverflow.com/questions/9677879/…

标签： javascript

【解决方案1】：

在调用您的函数之前，您必须等待 document.body 实际存在。

最简单的方法是在 HTML 标记的末尾调用此代码，而不是在 <head>

【讨论】：

【解决方案2】：

您还应该调用createContext() 函数。小提琴：http://jsfiddle.net/gXm8L/

【讨论】：

根据定义，他看到的错误直到函数被实际调用才会发生。
是的，在我刚刚提供的小提琴中，js被设置为onDomready，所以元素被找到并工作了。我说错了吗？

【解决方案3】：

也许你可以试试这个 -

window.onload=function(){
    createContext(100, 200);
};

function createContext(width, height) {
    var canvas = document.createElement('canvas');
    canvas.id = "1";
    canvas.width = width;
    canvas.height = height;
    document.body.appendChild(canvas);
    return canvas.getContext('2d');
}

检查这个小提琴 - http://jsfiddle.net/j4c7U/82/

【讨论】：