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, Apr 10 '16 at 06:16

score 1 · Accepted Answer · edited May 23 '17 at 12:15

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

General Javascript Syntax Query

1 Answers1