"Ruby Foundations" was retired on September 23, 2015. You are now viewing the recommended replacement.
Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll
Well done!
You have completed JavaScript Basics!
You have completed JavaScript Basics!
Preview
Practice using JavaScript by writing a "self-destructing message" program.
This video doesn't have any notes.
Related Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign upRelated Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign up
You've learned what JavaScript is,
where it runs, and
0:00
how to use some of its built-in commands.
0:03
You've written JavaScript in the console,
even created and linked a JavaScript file.
0:05
Now, you're going to work on
a practice exercise on your own,
0:10
a challenge of sorts.
0:12
You'll do this periodically throughout
the course to give you opportunities to
0:14
practice and
help make what you've learned sink in.
0:17
Let's go over what you'll need to do.
0:20
You're going to practice using JavaScript
by writing a self-destructing message
0:22
program.
0:27
The page will display
a message with an alert
0:27
dialog warning us that
the message will self-destruct,
0:30
then it displays the series of alerts that
count down from three, to two, to one.
0:33
After that, the message on the page
gets replaced by the text, boom, and
0:39
Message destroyed!
0:44
Appears in the console.
0:45
Launch the workspace with this video
to access the starter files for
0:47
this challenge.
0:50
In the file script.js, you'll find the
instructions for this practice challenge.
0:51
The lines with the two backslashes
in front of the text are JavaScript
0:56
comments, and you'll learn more about
writing comments in a later video.
1:00
For now, just know that any characters
immediately following the two backslashes
1:03
until the end of the line are ignored
by the JavaScript engine.
1:08
You're going to use much of what you've
learned so far to write this program.
1:12
So let's go over the instructions.
1:16
First, you'll need to display an alert
dialog with the content, Warning!
1:18
This message will self-destruct in.
1:23
Then, display a 3...
1:26
2...
1:28
1...
1:29
Countdown, as shown in the demo,
using alert dialog boxes.
1:29
I have provided the line of JavaScript
to help you complete the next step.
1:37
You don't need to change this code or
worry about what any of it means for now.
1:41
As the comment says,
this statements selects the <h1> element
1:45
on the page and
replaces its text with BOOM!
1:50
Soon, you'll be a pro at working
with JavaScript code like this, but
1:55
don't worry about it for now.
1:58
Finally, after the message self destructs,
where it gets replaced with the text BOOM!
1:59
You'll need to display the text,
Message destroyed!
2:04
In the console.
2:08
I've already linked the script.js
file to index.html.
2:10
And feel free to customize the initial
message displayed between the h1
2:14
heading tags.
2:18
As you work through this
practice challenge,
2:19
keep in mind that you're not expected
to remember everything right away.
2:22
You can refer to any notes you've taken,
code that you've written so far, or
2:25
go back and review a video.
2:29
This challenge is a great way to
practice what you've learned so far.
2:31
So good luck, have fun.
2:35
And in the next video,
I'll show you my solution.
2:36
You need to sign up for Treehouse in order to download course files.
Sign upYou need to sign up for Treehouse in order to set up Workspace
Sign up