The reason that many people think that it won is because it had
the best documentation and it still has outstanding documentation.
There's a lot JavaScript libraries that were there and
the people wrote them could use them.
But jQuery was this thing that like anybody could use,
it was well enough document.
And that pattern, the point we're not going to put a lot of jQuery slides in is
that they also show you just little snippets of code that you can cut and
paste and then adapt and make work.
So in general you need a way to animate the opening of a window with jQuery.
You go to Google and you type animate the opening of a window with jQuery and
you'll find often on thejQuery site, a little five line snippet of code,
that'll give you the starting point, and then you'll adapt.
So I'm not going to talk too much about that.
So this is sort of some very simple jQuery.
So what we do here is we are going to in our head document.
Sometimes folks prefer to put this down, near the end of the body, but
I'll just sort of use the style and put it in the head, and
you go download a version of the jQuery library.
And we're going to pull this library in and what it does is it jacks itself into
document object model and then makes it so that this variable dollar sign.
Dollar sign ends up being a function name.
jQuery takes over.
They just picked it.
Now, you can actually tell jQuery to pick a different one, but
dollar sign is the one that jQuery kind of pick.
And so dollar sign is a function call, and document is a parameter to that function.
And it returns an object, a JavaScript object,
that has many methods, .ready is on of those methods.
So the jQuery syntax takes a little getting used to because this is like
a function call and then this is a method within that function that happens to be
a function call that goes all the way to here.
And so, we tend to connect these things together and
we're also seeing the use in here of first class functions.
So the parameter, the first parameter to the jQuery ready method,
is this function, it's actually code.
Now, at a high level what we're saying here.
Is we are saying, when the document is ready, when it's fully loaded and
all the images have loaded, at that moment, please run some of our code.
And we wrote this code and we have a function that's got two lines in it.
One's an alert and one says in the console log it says, Hello JQuery.
And this is really common because often, what you want to do is,
after the page is loaded.
You want to sort of jack in various places and
add interactive elements to pieces of the page using jQuery, and
then having jQuery respond to the interactive things in that page.
And we'll build stuff that looks like that.
So let's go ahead and run this.
By the way, you can download the code here for
this set of examples on the php-intro.com/code jQuery zip.
I got that all downloaded and jquery-01,
whoops, sorry, got to clear that so
I can click jquery-01.
And hello.php, that was the code I just showed you.
Let me turn on developer console while I'm doing this.
So I got the developer console.
I'm going to watch the console.
I'm going to say hello.php.
So what happens is this page will load, it will run the JavaScript
it loads the jQuery library, let's start with the network look view of this.
I'll hit this page hello.php and you'll see that my php request response
happened and then in that it said wow, go load some more JavaScript.
And then in that JavaScript, it executed JavaScript and
said when the document has finished loading call my function.
And in that function you get call an alert, that's my alert.
So this function happens at the end of page loading, turns up this is important
because it takes a while for the browser to get the page all put together.
And if you're going to write JavaScript,
you're going to start looking at pieces of pages, it's useful, so
the first thing you kind of learn in jQuery Is how to trigger things that
happen after the page is loaded and that's what this ready method does.