[USE JQUERY TO DRAW ON CANVAS]

Question

i wonder why Jquery isnt use to draw on canvas,

html
<canvas id="c"></canvas>

Jquery
$(function(){

var canvas = $("#c"); //nothing happen but
//using javascript it successfully draw

var pen = canvas.getContext("2d");

pen.strokeText("Sololearn", 20, 30);

});

when i use jquery it always fails, only with jS it can pass, Can some one explain why?

Answer 1

You have to remember that JQuery return an WRAPPER object that is not SAME that nornal js DOM object.
For get it from an JQuery wrapper object, use:

wrapperObj[0]

or

wrapperObj.get(0)

Answer 2

Add [0] or .get(0) after $("#c") .

Like...
var canvas = $("#c")[0];

It's something to do with how jQuery selects elements -- it only saves a link not the element itself. I don't know exactly, I was just curious so I looked into your question.

Answer 3

I just saw this site. It doesn't really explain too well, but I think it gets quite complex when you start trying to explain the inner workings of a coding language/library. You should try Googling more things about how jQuery works.

https://stackoverflow.com/questions/2925130/jquery-equivalent-of-getting-the-context-of-a-canvas

Answer 4

KrOW oh, that technically explains clear why. 👍

Answer 5

What part you trying to use jQuery for exactly?

Answer 6

when i select a canvas and try to get its CONTEXT

Answer 7

look in my sample code

https://code.sololearn.com/Wlxh3VcNs6xl/?ref=app

Answer 8

Ofcourse it worked, but the explanation, can u elaborate

Answer 9

bcs i looked in so many codes here on sololearn i didnt see a single person uses jquery to draw on canvas, so i looked forward since i love using jquery

Answer 10

James thanks 4 ur help but i think explaining from some one lively is more efficient..

Any why, once again thnk u i will really looked through ur sorce🙆

Answer 11

🌟th3 c0d3r😎 👍👍👍👍

Answer 12

🌟th3 c0d3r😎 👍👍👍👍