Uploaded by Evans Chikasa

Introduction to JAVASCRIPT Programming Part 1

advertisement
JAVASCRIPT
Programming
What is JavaScript?
• It is a programming language that
is used to make web pages
interactive
• It is object based
• It is executed on the client’s or
user’s computer
• It is an interpreted language
JavaScript is NOT
Java!
• Though they have similar names,
JavaScript and Java are not the
same
• Java is a complex programming
language compared to Java
• Java is in the same category as
C/C++, VB, Python etc.
• JavaScript is a scripting language
Programming fundamentals
Variables
Conditionals
Comparisons
& Operators
Events
Objects
Functions
Program
Flow
Data Types
Prototypes
Arrays
What you need
to run JavaScript
• JavaScript is executed on
a user’s browser such as
• Google chrome
• Mozilla Firefox
• Internet Explorer
• Safari
• Opera
JavaScript vs HTML
JavaScript and HTML are completely
different languages
HTML is a markup language whereas
JavaScript is a programming language
JavaScript is written inside HTML
JavaScript uses events and actions to
make webpages interactive
What can
you do
with
JavaScript?
Create cookies,
build apps with
JavaScript
framework
1
Detect browser
being used on a
device
2
Validate forms
e.g passwords,
format checks
3
Create
animations,
slideshows,
scrollers,
JavaScript
Coding
• JavaScript is embedded in the HTML
code, between the open and close
HTML tags
• <HTML>
• <Body>
• <SCRIPT>
• alert(“Hello Guys!”)
• </SCRIPT>
• </Body>
• </HTML>
OUTPUTTING
DATA
• There are two ways you can
output data to an HTML
document. This can be done
using:
• document.write()
• .innerHTML
document.write()
This function is used to output values passed to
it.
For example, document.write(“Hello World”)
will print the text Hello World when run in the
browser
You should notice how the text appears on the
webpage. We have no control of where the text
should appear
.innerHTML
• When you want to print to a specific point
on the webpage, you can use the
.innerHTML
• This is done by naming elements within the
HTML code
• For example: <p ID=“parag1”></p>
• In the script tags, you can instruct JavaScript
to add text to the document at that position
using the ID tag
• <Script>
• Document.getElementyID(“parag1”).innerHTML
= “Hello World”
• </script>
Pop-up boxes
•These can be used to display text or other
information
•The text or information is not written on the
webpage like when you use document.write
and .innerHTML.
•Instead, the text is displayed as an overlay,
on top of the webpage
Download