General Javascript Syntax Query

Question

I am new to Javascript and its syntaxes. Hope you all can help clear my doubts.

Q1)

<script>
 $(document).ready(function() {...}
</script>

What does the "$(document...." part mean? I thought a function is started with

function(var){...}

? What the Difference? and when do i use "$" symbol?

Q2)

Js code

$('#dropzone').on('dragover', function(e) {
                e.preventDefault();
                e.stopPropagation();
                e.originalEvent.dataTransfer.dropEffect = 'copy';
            });

Html code

  <div id="dropzone">
        <span>Drop an image file here</span>
        <canvas></canvas>
    </div>

Based on the above, I see that "#dropzone" is linked to the "div id='dropzone'", correct? and i dont get the part of " function(e)"? what role does puting a function at that spot denotes?

Thank For your replies :)

$ is a shortcut reference to jQuery as long as it's loaded on the page. .ready is a special jQuery function that can only be called on the document which calls whatever function (function() {...}) it wraps when the page is done loading. You're very new, so learn JavaScript syntax first and when this all makes sense, you can move onto jQuery and the $ syntax. The .on is similar to JavaScript's .addEventListener. Again, learn the basics first. Make some playful apps and read a lot of tutorials. JavaScript is fun once you understand it. Good luck! — Evan Kennedy
– Evan Kennedy, Commented Apr 10, 2016 at 6:16

Community · Accepted Answer · 2017-05-23 12:15:54Z

1

See the links for more thorough explanations

Q1: $(document).ready essentially detects that the given page state is ready for manipulation.

Q1 part 2: $ is a copy of the jQuery function and can be used for many varying desired results by creating a jQuery object of a given element.

Q2: Essentially shorthand for "events" that is often passed to event handlers. In your example, The .on() method attaches event handlers to the currently selected set of elements in the jQuery object. I've provided a link to that as well at the bottom.

Explanation for Q1: $(document).ready

Explanation for Q1 part 2: $

Explanation for Q2: function(e) in the given context

Additional reading: .on

edited May 23, 2017 at 12:15

CommunityBot

11 silver badge

answered Apr 10, 2016 at 6:35

Benny

262 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

AHK Over a year ago

Thank You for your help. :)

Collectives™ on Stack Overflow

General Javascript Syntax Query

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related