Hello, in this jQuery video, we are going to cover the AJAX load method. So Ajax stands for Asynchronous JavaScript and XML. And it doesn't have to just be XML that can be a bit confusing. essentially put Ajax allows you to you know, interact with the server. So your back end without having to reload refresh your website, which is very powerful. The load method as you can probably get a load something from your server.

In our case, we're going to load a text file. So just something to bear in mind. I'm not using You know, it like this. So if you try implement it locally, and you know yourself, it is double clicking the index dot HTML file, try and run it and you click click, you know, you actually try and run this code that we that will code soon, you'll get an error like this. So you're going to need some form of server you could have a no SQL Server. Now I'm using something called Expand, which is a fantastic, I will provide a link to this, it is completely free.

There are other servers as well. So our seas have built in service by recommend no you go No, it's not recommend you're going to need a server. You could have an online server, for example, but you're going to need one, then put all your tech files all your content there. So also, I've created a txt file for this, even though it's on my computer, cuz this, this entire directory here is acting as a server. Technically, this is on a server so it's within the local server. I've got this piece of text the other says hello, how are you?

So when we click this epic button, it is going to get the content of that file and put it into this div. So let's let's detect when we are clicking a button. So epic fortune, click all of the events, click events. Part of this series. And now in here, we need to select the the actual HTML element or elements that we are going to, you know, load the content into, in this case, one elements of Ajax div. Right here, you can have any simple or complex selector that you want.

Then you put the keyword node for the function dot load. Now you specify the file path to your file. So this can be a, basically the EU or out and for us, because it's in the same place as the rest of our files, you just a text file, or txt. If this wasn't, maybe this was in a folder called Ajax, you would put then a forward slash so if it's a local for local for On several mean it is relative to the current file. Now the file is open. Now if we were to save it, run it and see what we get if I click it, I think see got the content and put it there.

But you may remember that lists had, you know, the new line for how do we you know, simulate that because Dave's you know, can handle new life. There's no reason why can't you have to put HTML in so you have to play in that no format. As you can see, obviously, if you want this to be a new line, you also need to put in well that there we go. Now we have got the the text in a format that was a bit more recognizable to the original file, we just had to put in great water That allows you to set a new line in HTML. So what we need to do as an extra test one load, you know, other while also trying to experiment with the content in this file, you can either type it out manually yourself, customize it or get the code from the GitHub page and cluding the text file.

And once you know have this, Troy, no added other HTML elements because it's a div, a div can pretty much have any HTML element inside of it. You know, the this thing here is a div. So in here, put other things maybe to make it bold, maybe to again, I'm going to actually leave that to your imagination. So that's it simple stuff. Really. They hope it is If not, you know where I am.

You can drop me a message and I will help you and I look forward to seeing you in the next video.