You are on page 1of 32

LEARNING OBJECTIVES:

• identify the features and


disadvantages of JavaScript;
• show how to code JavaScript in
HTML; and
• construct a website that
contains different pop-up boxes.
Let’s have a game!!!
INSTRUCTION:
• At Kahoot.it, students enter game-pin and
nickname on their own devices (phone, tablet, or
computer).
• Press “Start now” to let the fun begin!
• Students answer questions on their own devices
by selecting one of the four answer buttons.
JavaScript
JavaScript

It is the most popular and widely used


scripting language on the internet, and is
recognized and works in all major browsers,
such as Internet Explorer, Firefox, Opera,
Safari and Google Chrome.
BRENDAN EICH
How to Start Using JavaScript
Head
Body
Head and Body
FEATURES OF JAVASCRIPT

• JavaScript is case-
sensitive
• JavaScript can be
combined with CSS to
produce DHTML.
DISADVANTAGE OF JAVASCRIPT

• Some browsers do not


support JavaScript.
•JAVASCRIPT ≠ JAVA
HTML, CSS, AND JAVASCRIPT

• HTML – content
• CSS – style
• JAVASCRIPT – behavior
Popup Boxes

Popup boxes are those windows that


pop-out of your screen. They could be
before a page is fully loaded, effect of an
event on a page or before leaving a page.
Alert Box

It is used if you want to


make sure information comes
through the user
Example using alert box
Confirm box

It is used if you want the


user to verify or accept
something.
Example using confirm box
Prompt Box

Is often used if you want the user to


input a value before entering a page
Example using prompt box
And we’re done
PERFORMANCE RATING 3 2 1 SCORE
1. Did you use the proper background        
for your website?

2. Did you use such elements to add a        


touch of motion to your site?

3. Did you make your webpage easily        


scannable?

4. Did you make your website        


responsive?

5. Did you check your website for        


errors?

TOTAL  
GET READY FOR A SHORT QUIZ
TRUE OR FALSE

Write TRUE if the


statement is correct
and write FALSE if
not.
TRUE OR FALSE
1. JavaScript’s official name is AACMA

2. JavaScript is case-sensitive

3. JavaScript works like Java


4. You cannot mix JavaScript codes with
HTML tag

5. All browsers can read JavaScript codes


ANSWERS
ASSIGNMENT
• Try adding line breaks inside a pop up box, use a
back-slash followed by the letter n
ex code: <button onclick=“alert(‘Hello\nHow are
you?’)”> TRY IT </button>
reference:
https://www.w3schools.com/js/tryit.asp?filename=tryjs_al
ert2
• Create a web page using JavaScript with background
color
• Study the next lesson and answer the following
question:
How to insert a checkbox in a list in JavaScript?

You might also like