[JAVA] Basics of jQuery that even freeters can understand

Hello,

Today about jQuery

I would like to share the basic knowledge I have learned.

First of all

If you don't know a simple formula

It doesn't start, so let's learn from the official.

$ ('HTML element').Method (argument);

is.

Short!

I think some people thought,

I will add various things from here.

Of course, this doesn't end there.

Brief commentary

HTML element

For example,

index.html

<h1 >Hello<h1>

It is h1 to say in the place

Also, don't forget to add the last; (semicolon).

This is the basic syntax.

Now let's talk about what you can do with jQuery using this formula.

Can be animated

When I first saw it, I thought it was amazing!

Is it possible to make such a change by adding just two lines of jQuery description?

I was impressed and stared at the screen for a while like a child.

How to write,

$ ('HTML element').fadeOut (specify the speed at which the animation occurs);

is.

This will remove the html element at the specified location!

$ ('HTML element').fadeIn (specify the speed at which the animation occurs);

Will appear when

Brief commentary

When specifying the speed, please be aware that 1000 is 1 second

For fadeOut, slideUp is okay.

If you can change the color of the designated destination without permission, ...

This is also very easy to make

This is official.

$ ('HTML element').css（'Property(color)' ,  'Value (blue or something)'）;

You can change the color of the HTML element specified in this.

It's fun is not it.

Using the click event, "Ah, I often see this." Can make a movement

Next to a simple animation

I increased the amount of description a little and used the click event,

"Ah, this is the one I often see."

Let's make something like

The formula looks like this.

$ ('HTML element').Event name (function)(){
Event content
}）;

I would like to use "click" for this event name.

$ ('HTML element 1').click（function(){
$ ('HTML element 2').slideUp
}）;

By doing this,

When you click HTML element 1

HTML element 2 disappears.

It is wonderful. ..

jQuery is amazing ...

This is the end of the brief explanation

Let's meet again.