introduction to javascript

Tutorial 1
Introduction to
JavaScript

Section A – Programming, HTML,
and JavaScript

JavaScript Tutorial 1 - Introduction to JavaScript 1

Tutorial 1A Topics
 Section A – Programming, HTML, and
JavaScript
• About the World Wide Web
• Uses of JavaScript
• About Hypertext Markup Language
• How to creating an HTML document
• About the JavaScript programming language
• About logic and debugging

JavaScript 2
Tutorial 1 - Introduction

Programming, HTML, and
JavaScript
 The World Wide Web
• Created in 1989
 European Laboratory for Particle Physics
(Geneva Switzerland)
• Purpose
 Provide an easy way to access cross-
referenced documents that exist on the
internet

JavaScript 3

JavaScript
• Hypertext links
 Contain reference to locate and open specific
documents
• Hypertext Markup Language (HTML)
 Language used to design web pages
(documents)
• Web Browser
 Program that displays HTML documents

JavaScript 4

JavaScript
• Uniform Resource Locator (URL)
 A type of Uniform Resource Identifier (URI)
• Identifies names and addresses on the WWW
 A unique identifier for a web document
• e.g., a telephone number or mailing address

JavaScript 5

JavaScript
• Uniform Resource Locator (URL)
 Consists of 4 parts:
• Protocol → Hyper Text Transfer Protocol (HTTP)
• Domain Name → or Internet Protocol (IP) address
• Directory
• Filename
 Specific document filename

 index.(s)htm(l) or default.(s)htm(l)

JavaScript 6

JavaScript 7

JavaScript
 JavaScript’s role on the Web
• HTML
 Purpose → tell the browser how a document
should appear
 Static → can view or print (no interaction)

JavaScript 8

JavaScript
 JavaScript’s role on the Web
• JavaScript Programming Language
 Developed by Netscape for use in Navigator
Web Browsers
 Purpose → make web pages (documents)

more dynamic and interactive
• Change contents of document, provide forms and
controls, animation, control web browser window,
etc.

JavaScript 9

JavaScript 10

JavaScript 11

JavaScript 12

JavaScript
 Hypertext Markup Language
• HTML Document
 Text document that contains:
• Tags → formatting instructions
• Text to be displayed
 Document is parsed or rendered by browser

JavaScript 13

JavaScript
• HTML Document
 Tags
• Enclosed in brackets <tag>
• Generally consist of:
 Opening tags <tag>

 Closing tags </tag>

• Text contained between the opening and closing
tags are formatted according to tag instructions

JavaScript 14

JavaScript
• HTML Document
 Tags
• All HTML documents begin with <html> tag and
end with </html>
• HTML is not case sensitive

JavaScript 15

JavaScript
• HTML Document
 Tag Attributes
• Used to configure tags
• Placed before closing bracket of opening tag
 <tag attribute=“value”>some text</tag>

JavaScript 16

JavaScript 17

JavaScript 18

JavaScript 19

JavaScript
• HTML Document
 Web browser only acknowledges text and
valid tags
 Web browser ignores non-printing

characters
• Spaces, tabs, carriage returns
 Must use valid tags or special character
codes to accomplish this:
• Non-breaking space →  

JavaScript 20

JavaScript 21

JavaScript 22

JavaScript
 Creating an HTML Document
• Text editor (text)
 Notepad, WordPad
• Word Processor (that can create text
files)
 Word
• HTML Editor (WYSIWYG)
 FrontPage, PageMill
• HTML Converters (WYSIWYG)
 Word, PowerPoint

JavaScript 23

JavaScript 24

JavaScript
 The JavaScript Programming
Language
• Scripting Languages
 Executed by an interpreter contained within
the web browser (scripting host)
 Interpreter uses a scripting engine

• Converts code to executable format each time it
runs
• Converted when browser loads web document

JavaScript 25

JavaScript
Language
• JavaScript
 Originally called LiveScript when introduced
in Netscape Navigator
 In Navigator 2.0, name changed to

JavaScript
 Current version 1.5

• JScript
 MS version of JavaScript
• Current version 5.5
JavaScript 26

JavaScript
Language
• ECMAScript
 International, standardized version (Edition
3)
 Both versions (JavaScript and JScript)

conform to the standard
• Although both have proprietary extensions
 Focus of this text

JavaScript 27

JavaScript
Language
• JavaScript
 Two formats:
• Client-side
 Program runs on client (browser)

• Server-side
 Program runs on server

 Proprietary to web server platform

JavaScript 28

JavaScript 29

JavaScript
 Logic and Debugging
• Syntax
 Rules of the language
• Logic
 Order of execution of various parts of the
program

JavaScript 30

JavaScript
• Syntax error
 Misuse of syntax
• e.g., typing fer instead of for
• Logic errors
 Unintended operation of program
• e.g., Infinite loop

JavaScript 31

JavaScript
• Debugging
 Tracing and resolving errors in a program
 Coined by Admiral Grace Hopper

• Moth short-circuited a relay
 “bug” in the system

• Removed it → system “debugged”
 Not an exact science

JavaScript 32

introduction to javascript

More Related Content

What's hot

Similar to introduction to javascript

More from Kumar

introduction to javascript