正常的情况下一般在JavaScript中使用canvas,会用到如下代码:

   var canvas=document.getElementById("canvas");
var context=canvas.getContext('2d');

最近在练习canvas时,使用了jQuery便用到了如下代码:

   var $canvas=$("#canvas");
var context=$canvas.getContext('2d');

以上代码看起来没有什么题,可是在运行的时候发现程序却无法显示

打开控制发现报错为:

Uncaught TypeError: $canvas.getContext is not a function at window.onload

后来查了下文档了解到,当时用$('#canvas')获取元素时,返回的的是一个 jQuery 的对象,并不是DOM元素,想要返回DOM元素,可以用下面的方法:

   var $canvas=$("#canvas")[0];
var context=$canvas.getContext('2d');

使用上面的方法就可以成功返回DOM元素了

在jQuery中使用canvas时遇到的问题的更多相关文章

  1. jquery中bind事件时的命名空间用法(转)

    场景:页面上的某个元素bind多个click事件处理函数,视用户的具体交互情况来决定到底使用哪个处理函数. 问题: unbind时会解绑所有的click事件,造成误伤.如果之前bind时有定义处理函数 ...

  2. 浅谈jquery中prop()和attr()

    我们都知道,一般在jquery中设置属性时要用到attr()方法,现在我们有一个效果,点击按钮切换复选框的选中状态,下面贴出html代码: <input type="checkbox& ...

  3. [转]jquery的ajax交付时“加载中”提示的处理方法

    本文转自:http://www.educity.cn/wenda/77121.html jquery的ajax提交时“加载中”提示的处理方法    方法1:使用ajaxStart方法定义一个全局的“加 ...

  4. 史上最全的CSS hack方式一览 jQuery 图片轮播的代码分离 JQuery中的动画 C#中Trim()、TrimStart()、TrimEnd()的用法 marquee 标签的使用详情 js鼠标事件 js添加遮罩层 页面上通过地址栏传值时出现乱码的两种解决方法 ref和out的区别在c#中 总结

    史上最全的CSS hack方式一览 2013年09月28日 15:57:08 阅读数:175473 做前端多年,虽然不是经常需要hack,但是我们经常会遇到各浏览器表现不一致的情况.基于此,某些情况我 ...

  5. jQuery中使用$.each()遍历数组时要注意的地方

    使用jQuery中 $.each()遍历数组,要遍历的数组不能为空(arry!="") 例如:           $.each(arry, function (i, item)  ...

  6. jquery 中的 $("#id") 与 document.getElementById("id") 的区别

    以前没注意过,认为jquery 中的 $("#air") 与 document.getElementById("air") 是一回事,指的是同一个东西.在今天写 ...

  7. jquery中$.each()的用法

    each()函数是基本上所有的框架都提供了的一个工具类函数,通过它,你可以遍历对象.数组的属性值并进行处理.jQuery和jQuery对象都实 现了该方法,对于jQuery对象,只是把each方法简单 ...

  8. [转载]Jquery中$.get(),$.post(),$.ajax(),$.getJSON()的用法总结

    本文对Jquery中$.get(),$.post(),$.ajax(),$.getJSON()的用法进行了详细的总结,需要的朋友可以参考下,希望对大家有所帮助. 详细解读Jquery各Ajax函数: ...

  9. JQuery中的工具函数总结

    前提引入 前提当然也是要引入Jquery啦... <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" typ ...

随机推荐

  1. spring装配Bean过程

    主要流程: 1.读取配置文件 2.实例化bean和填充bean属性 这个粗略的流程感觉更像是一个需求,有了这个需求,那么spring内部是怎么处理的呢? 我们知道spring的两个核心接口BeanFa ...

  2. Windows server2012如何运行Javaweb项目?

    最近用java写了个小项目,想要部署到服务器,于是买了个Windows server2012,但是不知道怎么部署,后来才知道需要配置java运行环境.经过一番研究最终搞定了.下边是我的个人总结,由于是 ...

  3. cocos2dx3.2移植android

    LOCAL_PATH := $(call my-dir)LOCAL_MYDIR = $(LOCAL_PATH)/../../Classesinclude $(CLEAR_VARS) $(call im ...

  4. c# winform 窗体之间的传参

    说起winform程序中窗体之间的参数互传,大家找度娘会找到很多方法: 1.在窗体类中创建全局变量,类型为公开.静态的: 2.在窗体类中定义狗仔函数: 3.通过实践来船体参数: 这三种思路完全来自于霖 ...

  5. 三种方法运行python

    注:本文基于windows 1.交互式解释器 配置好环境变量后,命令行中打开,输入python即可,Ctrl+Z退出 命令行选项 当从命令行启动Python时,可以给解释器一些选项,如下: -d   ...

  6. PE文件格式分析

    PE文件格式分析 PE 的意思是 Portable Executable(可移植的执行体).它是 Win32环境自身所带的执行文件格式.它的一些特性继承自Unix的Coff(common object ...

  7. java MD5比较文件内容

    最近用到,记下来…… 功能: 对指定目录下的所有TXT文件,通过MD5比较内容,删除掉重复的文件.文件的扩展可以修改成.docx..doc..jpg..png,或者其它类型,根据需求灵活修改. pub ...

  8. IK-Analyzer(5.3.1)动态配置自定义词典

    参考文献:http://blog.csdn.net/fatpanda/article/details/37911079 jar包: IK-Analyzer-extra-5.3.1.jar IKAnal ...

  9. 中文编程语言之Z语言初尝试: ZLOGO 4

    原文: https://zhuanlan.zhihu.com/p/31505895. 作者为本人. @TKT2016 开发的Z语言(ZLOGO是它的一个部分)是本人至今看到的唯一一个仍活跃开发的开源且 ...

  10. TensorFlow 处理图片

    目标:介绍如何对图像数据进行预处理使训练得到的神经网络模型尽可能小地被无关因素所影响.但与此同时,复杂的预处理过程可能导致训练效率的下降.为了减少预处理对于训练速度的影响,TensorFlow 提供了 ...