正常的情况下一般在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. Python的classmethod和staticmethod区别

    静态方法(staticmethod) 类方法(classmethod) 静态方法和类方法都可以通过类名.方法名或者实例.方法访问. #-*- coding:utf8 -*- class A(objec ...

  2. SSH框架基础

    首先,SSH不是一个框架,而是多个框架(struts+spring+hibernate)的集成,是目前较流行的一种Web应用程序开源集成框架,用于构建灵活.易于扩展的多层Web应用程序. 集成SSH框 ...

  3. 手 Q 人脸识别动画实现详解

    欢迎大家前往腾讯云社区,获取更多腾讯海量技术实践干货哦~ 前言 开门见山,先来看下效果吧. 看到这么酷炫的效果图,不得不赞叹一下我们的设计师.然而,站在程序员的角度上看,除了酷炫之外更多的是复杂.但是 ...

  4. 《Linux命令行与shell脚本编程大全》第十六章 控制脚本

    一些控制脚本的方式:向脚本发送信号.修改脚本优先级,在脚本运行时切换到运行模式 16.1 处理信号 linux利用信号与运行在系统中的进程进行通信. 也可以通过对脚本进行编程,使其在收到特定信号时执行 ...

  5. C#设计模式之十七观察者模式(Observer Pattern)【行为型】

    一.引言   今天是2017年11月份的最后一天,也就是2017年11月30日,利用今天再写一个模式,争取下个月(也就是12月份)把所有的模式写完,2018年,新的一年写一些新的东西.今天我们开始讲& ...

  6. 深入了解Android蓝牙Bluetooth——《基础篇》

    什么是蓝牙?   也可以说是蓝牙技术.所谓蓝牙(Bluetooth)技术,实际上是一种短距离无线电技术,是由爱立信公司公司发明的.利用"蓝牙"技术,能够有效地简化掌上电脑.笔记本电 ...

  7. Java集合(1)一 集合框架

    目录 Java集合(1)一 集合框架 Java集合(2)一 ArrayList 与 LinkList Java集合(3)一 红黑树.TreeMap与TreeSet(上) java集合(4)一 红黑树. ...

  8. O(N^2)最长上升子序列

    //最长上升子序列o(N^2)可以不连续的子序列, //状态为maxlen[i]表示以a[i]为终点最大上升子序列长度 #include<iostream> #include<cst ...

  9. Jersy、Jetty和Servlet

    1.Jersy框架 Jersey RESTful WebService框架是一个开源的.产品级别的JAVA框架,是JAX-RS的参考实现.Jersey提供自己的API,其API继承自JAX-RS,提供 ...

  10. String、StringBuilder和StringBuffer

    1.string不可变性 java的docs有这样一句话:Strings are constant; their values cannot be changed after they are cre ...