Welcome back.
So in this video we're going to go over the get content method.
So first thing I want you to do is we're gonna go to the H2 Doc shortcut on our desktop go to learn
advanced J query and right click and do new folder type in zero to get content method.
OK close that out.
Next we're going to Sublime.
We're going to set up the files so let's right click on get content method and we're going do index
dot HD Himmel and then let's hit control and do control ask and demand.
OK so what I want to do is let's go to the set object query folder.
We're gonna order the index that age to Mel control.
A control C and then calls that file out.
Paste it here and now we have all the files we need to get started.
And I want to test the javascript file to make sure we have it pointed in the right area.
So we're gonna do connected and I will go to the end and save that when a right click open in the browser
inspect go to the council
and we're connected.
It's given me and different error but that doesn't have anything to do with us so we're good to go.
So close that out and let's delete this and save it.
And now I'm going to tell you exactly what we're gonna be doing in the course.
So J query contains powerful methods for changing and manipulating H2 all elements J query DOM manipulation.
One very important part of J query is the possibility to manipulate the DOM J.
J.
QUERY COMES WITH A BUNCH OF Dom related methods that make it easy to access and manipulate elements
and attributes.
So the Dom is a document object model and that's so the get content method.
There are three simple methods.
You have the text method the H2 mail method and the value method.
So the one where we're gonna work on first is the text method.
So the text method sets of returns the text content of a selected element.
So let's go to our index start each to mail file and we're gonna build out the elements that we need
for this test.
So what we're gonna do is we're gonna do the paragraph tag with an idea of test and I'm gonna close
the paragraph tag.
This is bold
text period and then below that I'm going to do a button with an idea beauty and one and I'm a type
and show text.
OK.
So now what I want to do is let's go over to the main digest file and we're going to write in document
and we're going to do dot ready function.
OK.
And we will do this.
And then what I'm going to do is we're gonna do dollar sign and we're going to call the I.D. of button
B10 one dot click.
So when we click we're going to run a function and the function is gonna be.
I set this up correctly.
There we go.
We're gonna do an alert.
So this is the return on the function.
So we're gonna return it alert and it's going to say text plus
the idea of test that taxed so we'll do that taxed
and I'm in a close that close these and let's give this a shot.
So let's go into our index that aged in my file right click open the browser and when I click show text
this is some bold text.
So what is doing is we're calling to show this.
We wanted to return it as an alert.
So when I click this this is some bold text.
OK.
So that is the text method.
Now we're gonna do the H to meddle method next.
So what I want to do with this one is we're gonna do another button with an idea of B10 two and we're
gonna do Shell HD Himmel.
And then we'll close that button tag.
And now we're gonna go back into the main dot J.S. and inside of this bracket here right below this
bracket because we want to keep it in the main function the document ready function.
So we want to keep it inside of there we're gonna do the dollar sign and we're gonna do button.
So I.D. B10 one between two dot click.
So when we click I wanted to run this function.
OK.
And then when I when I run that function I wanted to return an alert.
So we're really the alert and we'll do.
I have to spell the correctly.
There we go.
I want to do alert.
And then we're gonna do H Tim l colon space and then we're gonna do plus dollar sign and we're gonna
do I.D. of cast and we make that lowercase because it's case sensitive.
And what I'm to do is dot H Tim L and I'll close this and then we'll close this.
And when I save that and I go back to the index that aged him I'll file right click and open in the
browser.
Now when I click on Show H to him l it's going to show us the bold h t Mel so whatever.
H to l we're using around the bold tag Well we're using the bold tag.
So anything inside of the bold tag next to it to the left or the right.
That's what it's gonna show.
It's showing HD him all.
So that's another method that you can use.
Now the final method we're going to talk about is the I believe it's the value method.
Let me make sure I'm telling you the right stuff here yes it's the value method.
So the value method sets of returns the value of form of form fields.
So let's try that one now.
So what we're gonna do is we're gonna close this I want you to comment out this H tomorrow here return
a couple times and save that go to the J here and we're going to comment this out and then what I'm
going to do is I'm going to write in the content we need for the value method.
So we're going to do the paragraph tag we're going to give name and then input type is gonna be taxed.
The idea is gonna be test the value.
There's gonna be J query.
OK.
And then what we're gonna do is we're gonna make a button show value.
Now when I go into the javascript file we're gonna write in the document that ready for the function
and then inside the function we're gonna return the button.
So we're gonna do.
Button dot click.
So when we click that we're gonna run another function.
And I want to return the alert and we're gonna show the value
plus we're gonna call the I.D. of test.
So let's put that in quotes and then we'll do I.D. test and we're gonna do dot value.
OK.
And then we'll close that close this one close that one and this one I'll save that.
We're gonna go to index on each time all right click open in the browser.
And when I show the value we have J.
Query.
So that is the value now.
So that that is the value method.
So that's all I have for this video.
But like I said I wanted to show you those three methods because that's the key to the get content method.
OK.
So with that in mind I'll see in the next video.
Thanks for watching.