Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript jQuery Basics (2014) Introduction to jQuery Ways to Include jQuery in a Project

Rifqi Fahmi
Rifqi Fahmi
23,164 Points
Posted by Rifqi Fahmi
Rifqi Fahmi
23,164 Points

why we dont't add the parantheses ????

I am confuse with no parantheses when we call the function such as in this video 

function myCode() {
$(".warning").hide.show("slow");
}

$("document").ready.(myCode);

can someone explain why we don't add the parantheses when calling the function???

Jacob Mishkin
Jacob Mishkin
23,117 Points

Here is a great breakdown of the ready() method:

http://stackoverflow.com/questions/9899372/pure-javascript-equivalent-to-jquerys-ready-how-to-call-a-function-when-the

3 Answers

Jonathan Grieve
MOD
Jonathan Grieve
Treehouse Moderator 91,252 Points
Jonathan Grieve
Jonathan Grieve
Treehouse Moderator 91,252 Points

The second function is more like a helper for the browser. document.ready is code for the browser not to begin implementing the code until the document has finished loading.

$("document").ready();
Rifqi Fahmi
Rifqi Fahmi
23,164 Points
Rifqi Fahmi
Rifqi Fahmi
23,164 Points

then why don't we write it like this ??

$("document").ready.(myCode());
Jonathan Grieve
Jonathan Grieve
Treehouse Moderator 91,252 Points
Jonathan Grieve
Jonathan Grieve
Treehouse Moderator 91,252 Points

Because we're not really performing any actiosn on this line of code. What we're doing in this line of code is helping Jquery determine when to make the code available to the DOM. If we were to use this, we could put our link to jquery anywhere in our HTML file and it would work.

However as the video goes on to explain, if you put the link to jquery, e.g. 

<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>  <!-- link to hosted jquery library - this is what powers jquery -->
<script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>  <!-- past versions of jquery -->
<script src="js/app.js"></script>  <!-- link to jquery code-->

At the bottom of your file you wouldn't need to use document.ready. You could put your code inside the jquery object. like this 

$(function(
//code goes here

));
Rifqi Fahmi
Rifqi Fahmi
23,164 Points
Rifqi Fahmi
Rifqi Fahmi
23,164 Points

I think you miss my intent hmmmmmm, okay then to make it right what is the different between this

$("document").ready.(myCode);

and this

$("document").ready.(myCode());

the differentiate is the parantheses in myCode function

Jonathan Grieve
Jonathan Grieve
Treehouse Moderator 91,252 Points
Jonathan Grieve
Jonathan Grieve
Treehouse Moderator 91,252 Points

Neither is valid code in my experience.

But if you were to write mycode() than this is a function call. But mycode would be more like an event handler.

I hope this helps. But maybe someone can help explain this better :)

Jacob Mishkin
Jacob Mishkin
23,117 Points

Here is an example of using the ready method:

<html lang="en">

<head>

  <meta charset="utf-8">

  <title>ready demo</title>

  <style>

  p {

    color: red;

  }

  </style>

  <script src="https://code.jquery.com/jquery-1.10.2.js"></script>

  <script>

  $( document ).ready(function() {

    $( "p" ).text( "The DOM is now loaded and can be manipulated." );

  });
  </script>
</head>

<body>

<p>Not loaded yet.</p>

</body>

</html>

What is happening here is a way for you to set up Jquery. think of it was a JS wrapper, for your code to run, once the DOM is loaded the JS can run.

Rifqi Fahmi
Rifqi Fahmi
23,164 Points
Rifqi Fahmi
Rifqi Fahmi
23,164 Points

thanks for all of your responds, i get it now :)

Leon Segal
Leon Segal
14,754 Points
Leon Segal
Leon Segal
14,754 Points

I don't know if this is the right way to think about it, but I think of it not needing the parentheses as the (handler) required by ready() function (in this case: myCode()) is looking for a function to call so it is redundant to use () to denote a function call.

Also, if you use myCode(), that code will run as soon as the interpreter comes across it and the document may not be ready, so your code won't work as intended. If you leave myCode as a sort of identifier, then the jQuery code will run it once the document is ready and the DOM has loaded (as I said, ready() knows it is looking for a function to run).

If I'm wrong, hopefully someone will correct me.