Embed Size (px)
DESCRIPTION
Javascripting Look at this Javascript function showAlert() { alert ("Hello world!"); } This looks similar to the PHP code from the other day, but it has it’s own syntax. Most programming languages look a somewhat similar
Citation preview
USING JAVASCRIPT TO SHOW AN ALERTWeb DesignSec 6-2
Part or all of this lesson was adapted from the University of Washington’s “Web Design & Development I” Course materials
Objectives• The student will:
• Understand how a client-side script fits within the context of an HTML page.
• Know some basic Javascript syntax.
Javascripting• Look at this Javascript
<script> function showAlert() {
alert ("Hello world!"); }
</script>• This looks similar to the PHP code from the other day, but
it has it’s own syntax.• Most programming languages look a somewhat similar
Javascripting• Before this function can work, we must first call the
showAlert() function. • JavaScript functions are called in response to events.
• When the page loads, or when a user clicks on, hovers over, or tabs to a specific link, these are all events.
• We can instruct JavaScript to watch for these events, and if or when they occur, execute the specified function.
• Example –• Let's say we want to execute the showAlert() function after the
body of the web page is fully loaded. One way to do that is to add the onload attribute to the <body> element of our web page, like this:
<body onload="showAlert()">
Summary
• Like HTML and CSS, Javascripts are written in a specific language• Different syntax• Upper and lower case matters!
• Javascripts are defined in a <script> section in the <head> section of the HTML file.
• Javascripts need to be “called” to run• Called in response to events (click a button, load a page, etc)
Rest of Today• Download the homework for today.• You will add a button to your Javascript page and
customize it with CSS code.• The CSS code can be either in your javascript.html file or your
mystyle.css file.
Javascript file:
Javascript file:
