Are you ready for the exciting stuff and I know the earlier lesson was Temel and success, now we get
to get into the JavaScript because we've got our basic structure set up.
The first thing that I usually like to do is select my elements and add them in as objects within my
JavaScript, which makes it a whole lot easier for me to select them and make use of them.
So I'm using query selector, I use query selector quite a bit.
We can also use different ones.
So we've got a button which is element there so we can use.
If we have ID, we can get element by ID, we can also get elements by tag name, get elements by name,
get elements by class name.
But really at the end of the day, the query selector is the easiest one to use because this one is
going to be consistent with the way that we select CSFs.
They're using const setting up another one.
So we've got our player one area.
So this is where the gameplay for player one is.
And again, query selector a quick and easy way.
It's going to give us a quick and easy way to access that element information and what query selector
all will do is query selector all gives you the option to select more than one element.
So typically if you're using class or different tags and you've got more than one on the page, whereas
I've got a really simple application, so I don't have a whole lot happening within my HTML.
So now that we've selected all the elements into usable format in our JavaScript, the next step is
to make our button clickable.
So now we have a nice button here, but it doesn't do anything when we click it so we can use JavaScript
in order to make a clickable using that button object that we just created.
We're adding an event listener and then we need to specify what type of event we're listening for.
So we're going to listen for a click.
You have an option now to create either a function, so link it to a function that gets invoked when
the event listener gets triggered.
Or we can do an anonymous function, which is the case that I'm going to do here where we don't need
a name and we're just going to have the function sitting within the event.
Listener, a console logout the word works.
Always a good idea to check along the way.
And this is one of the key functionalities of our game.
So we want to make sure it works at this point.
So go ahead and click the button and you could see some type of output happening within your console.
Try it out for yourself.
Set up all of your document elements into as JavaScript objects and you'll be ready to move on to the
next step.
And the next step is going to be where we're going to look at JavaScript, not random, which is going
to give us the ability to provide a random output for the gameplay.
So that's still to come.