Cannot read property 'getContext' of null和Failed to execute 'getContext' on 'HTMLCanvasElement':

1、chrome/极速360浏览器报错:Cannot read property 'getContext' of null

filefox报错:TypeError: c is null

IE Edge:控制台没有报错,但是canvas图像也不显示

IE10/IE9报错:SCRIPT5007: 无法获取未定义或 null 引用的属性“getContext”

解决方法:

 将绘制方法,即绘制图片的<script>的js方法,放在body<canvas></canvas>内容下面

       因为Chrome下需要文档载入完成后才能获得canvas对象。

ps:

修正问题后,IE8报错:SCRIPT438: 对象不支持“getContext”属性或方法

IE8及以下的浏览器不支持canvas.

 

 

2、Uncaught TypeError: Failed to execute 'getContext' on 'HTMLCanvasElement': 1 argument required, but only 0 present
出错原因:有以下代码

if(document.getElementById("myCanvas").getContext  ){
}


解决办法:getContext方法需要接收参数:2d,即

if(document.getElementById("myCanvas").getContext("2d")  ){
}

 

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
这个错误是由于在使用`useRef`时,尝试读取一个空值(null)的属性引起的。引用中提到了类似的错误信息,但是和你的问题有一些差异。不过,问题的根本原因是相同的。 根据引用的描述,这个错误通常是由于DOM元素获取失败导致的。可能是因为你的标签canvas的获取失败,所以在之后的代码中无法使用`useRef`来引用这个DOM元素。引用中的例子也提示了这个问题,当尝试在一个空值上使用`indexOf`时,会导致类似的错误。 为了解决这个问题,首先要确保你正确获取了标签canvas的DOM元素。你可以使用`document.getElementById`或者其他相关的方法来获取DOM元素。然后,再使用`useRef`来引用这个获取到的DOM元素。这样,就可以避免空值的情况,并顺利使用`useRef`的属性和方法。 下面是一个修改后的代码示例,你可以参考一下: ```javascript // 获取canvas DOM元素 var canvas = document.getElementById('myCanvas'); // 使用useRef引用canvas var canvasRef = useRef(canvas); // 在之后的代码中使用canvasRef来访问canvas的属性和方法 ``` 通过以上的修改,你应该能够避免这个错误并正常使用`useRef`了。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* [“TypeError: Cannot read properties of null (reading ‘getContext‘)](https://blog.csdn.net/qq_50276105/article/details/128972733)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 33.333333333333336%"] - *2* [ASP.NET MVC运行出现Uncaught TypeError: Cannot set property __MVC_FormValidation of null的解决方法](https://download.csdn.net/download/weixin_38680671/14876308)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 33.333333333333336%"] - *3* [TypeError: Cannot read properties of null (reading ‘indexOf‘)](https://blog.csdn.net/m0_49608552/article/details/124703675)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 33.333333333333336%"] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值