Question

164

Can regular JavaScript be mixed with jQuery?

rated 0 times [ 165] [ 1] / answers: 1 / hits: 117008 / 14 Years ago, thu, september 9, 2010, 12:00:00

For example, can I take this script (from mozilla tutorial):

<html>

 <head>

  <script type=application/javascript>

    function draw() {

      var canvas = document.getElementById(canvas);

      if (canvas.getContext) {

        var ctx = canvas.getContext(2d);



        ctx.fillStyle = rgb(200,0,0);

        ctx.fillRect (10, 10, 55, 50);



        ctx.fillStyle = rgba(0, 0, 200, 0.5);

        ctx.fillRect (30, 30, 55, 50);

      }

    }

  </script>

 </head>

 <body onload=draw();>

   <canvas id=canvas width=150 height=150></canvas>

 </body>

</html>

and mix this JavaScript with jQuery's document.ready instead of relying on onload?

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

janjadonb

Add To Favorites

Follow

Total Points: 4

Total Questions: 114

Total Answers: 118

Location: Mali

Member since Fri, Dec 3, 2021

3 Years ago

janjadonb questions

1 How to execute slickNext method in react-slick carousel?

Tue, Nov 10, 20, 00:00, 4 Years ago

1 How to set focus on custom input in ReactJS using useRef and react hooks?

Fri, Oct 23, 20, 00:00, 4 Years ago

1 React Router scroll page to the top after transition

Wed, Oct 14, 20, 00:00, 4 Years ago

1 Vue3 Creating Component Instances Programmatically on button click

Wed, Oct 7, 20, 00:00, 4 Years ago

1 How to create array of strings in VueJS?

Tue, Apr 14, 20, 00:00, 4 Years ago

View All

answered 14 Years ago mariamiyanab · Accepted Answer

Yes, they're both JavaScript, you can use whichever functions are appropriate for the situation.

In this case you can just put the code in a document.ready handler, like this:

$(function() {

  var canvas = document.getElementById(canvas);

  if (canvas.getContext) {

    var ctx = canvas.getContext(2d);



    ctx.fillStyle = rgb(200,0,0);

    ctx.fillRect (10, 10, 55, 50);



    ctx.fillStyle = rgba(0, 0, 200, 0.5);

    ctx.fillRect (30, 30, 55, 50);

  }

});