Lesson 19. JavaScript errors Since JavaScript is an interpreted language, syntax errors will usually cause the script to fail. Both browsers will provide.

Slides:



Advertisements
Similar presentations
Introducing JavaScript
Advertisements

Essentials for Design JavaScript Level One Michael Brooks
JavaScript FaaDoOEngineers.com FaaDoOEngineers.com.
HTML 5 and CSS 3, Illustrated Complete Unit L: Programming Web Pages with JavaScript.
The Web Warrior Guide to Web Design Technologies
Web Development in Microsoft Visual Studio Slide 2 Lecture Overview Introduce Visual Studio 2013 Create a first ASP.NET application.
Chapter 7 © 2001 by Addison Wesley Longman, Inc. 1 Chapter 7 Sebesta: Programming the World Wide Web.
Working with JavaScript. 2 Objectives Introducing JavaScript Inserting JavaScript into a Web Page File Writing Output to the Web Page Working with Variables.
Tutorial 10 Programming with JavaScript
HTML Recall that HTML is static in that it describes how a page is to be displayed, but it doesn’t provide for interaction or animation. A page created.
Information Technology Center Hany Abdelwahab Computer Specialist.
JavaScript 101 Lesson 5: Introduction to Events. Lesson Topics Event driven programming Events and event handlers The onClick event handler for hyperlinks.
JavaScript, Fourth Edition
XP Tutorial 1 New Perspectives on JavaScript, Comprehensive1 Introducing JavaScript Hiding Addresses from Spammers.
Inline, Internal, and External FIle
Introduction to JavaScript. Aim To enable you to write you first JavaScript.
INTRODUCTION TO CLIENT-SIDE WEB PROGRAMMING ACM 511 ACM 262 Course Notes.
DHTML. What is DHTML?  DHTML is the combination of several built-in browser features in fourth generation browsers that enable a web page to be more.
4.1 JavaScript Introduction
Advanced Web Design Scripting Tutorial Chapters. Scripting Intro The scripting part of the forthcoming Advanced Web Design textbook introduces you to.
SEG3210 DHTML Tutorial. DHTML DHTML is a combination of technologies used to create dynamic and interactive Web sites. –HTML - For creating text and image.
WEEK 3 AND 4 USING CLIENT-SIDE SCRIPTS TO ENHANCE WEB APPLICATIONS.
DHTML: Dynamic HTML Internet Technology1. What is DHTML? A collection of enhancements to HTML ► To create dynamic and interactive websites Combination.
SEG3210 DHTML Tutorial. DHTML DHTML is a combination of technologies used to create dynamic and interactive Web sites. –HTML - For creating text and image.
Creating an Animated Web Page
Working with Objects Creating a Dynamic Web Page.
CITS1231 Web Technologies JavaScript and Document Object Model.
Client Scripting1 Internet Systems Design. Client Scripting2 n “A scripting language is a programming language that is used to manipulate, customize,
What is Java Script? An extension to HTML. An extension to HTML. Allows authors to incorporate some functionality in their web pages. (without using CGI.
Lesson13. JavaScript JavaScript is an interpreted language, designed to function within a web browser. It can also be used on the server.
Client Side Programming with JavaScript Why use client side programming? Web sides built on CGI programs can rapidly become overly complicated to maintain,
1 JavaScript in Context. Server-Side Programming.
Tutorial 10 Programming with JavaScript. XP Objectives Learn the history of JavaScript Create a script element Understand basic JavaScript syntax Write.
Tutorial 10 Programming with JavaScript
Using Client-Side Scripts to Enhance Web Applications 1.
Extending HTML CPSC 120 Principles of Computer Science April 9, 2012.
DHTML: Working with Objects Creating a Dynamic Web Page.
Chapter 5: Windows and Frames
Introduction to Programming the WWW I CMSC Summer 2003 Lecture 7.
Web Development 101 Presented by John Valance
Cs332a_chapt10.ppt CS332A Advanced HTML Programming DHTML Dynamic Hypertext Markup Language A term describing a series of technologies Not a stand-a-lone.
Sahar Mosleh California State University San MarcosPage 1 JavaScript Basic.
JavaScript Introduction.  JavaScript is a scripting language  A scripting language is a lightweight programming language  A JavaScript can be inserted.
TOPIC II Dynamic HTML Prepared by: Nimcan Cabd Cali.
1 JavaScript in Context. Server-Side Programming.
HTML Overview Part 5 – JavaScript 1. Scripts 2  Scripts are used to add dynamic content to a web page.  Scripts consist of a list of commands that execute.
WDMD 170 – UW Stevens Point 1 WDMD 170 Internet Languages eLesson: Variables, Functions and Events (NON-Audio version) © Dr. David C. Gibbs WDMD.
Copyright © Terry Felke-Morris WEB DEVELOPMENT & DESIGN FOUNDATIONS WITH HTML5 7 TH EDITION Chapter 14 Key Concepts 1 Copyright © Terry Felke-Morris.
Tutorial 10 Programming with JavaScript. 2New Perspectives on HTML, XHTML, and XML, Comprehensive, 3rd Edition Objectives Learn the history of JavaScript.
Javascript Overview. What is Javascript? May be one of the most popular programming languages ever Runs in the browser, not on the server All modern browsers.
Lesson 30: JavaScript and DHTML Fundamentals. Objectives Define and contrast client-side and server-side technologies used to create dynamic content for.
Javascript Intro Instructor: Shalen Malabon. Lesson Plan Core Javascript Syntax Types and Objects Functions DOM Event Handling Debugging Javascript Smarter.
JavaScript Introduction and Background. 2 Web languages Three formal languages HTML JavaScript CSS Three different tasks Document description Client-side.
Tutorial 10 Programming with JavaScript. 2New Perspectives on HTML, XHTML, and XML, Comprehensive, 3rd Edition Objectives Learn the history of JavaScript.
Chapter 10 Dynamic HTML (DHTML) JavaScript, Third Edition.
1 CSC160 Chapter 1: Introduction to JavaScript Chapter 2: Placing JavaScript in an HTML File.
JAVASCRIPT A quick review. True False ■The DOM is a standardized way of referring to parts of a Web page. ■TRUE ■In the DOM, attributes have their own.
JavaScript and AJAX 2nd Edition Tutorial 1 Programming with JavaScript.
XP Tutorial 10New Perspectives on HTML, XHTML, and DHTML, Comprehensive 1 Working with JavaScript Creating a Programmable Web Page for North Pole Novelties.
Chapter 13: DHTML: Object Model and Collections CIS 275—Web Application Development for Business I.
Introduction to.
DHTML.
JavaScript Event Handling.
Introduction to JavaScript
DHTML Javascript Internet Technology.
A second look at JavaScript
DHTML Javascript Internet Technology.
Introduction to JavaScript
Web Programming and Design
Presentation transcript:

Lesson 19

JavaScript errors Since JavaScript is an interpreted language, syntax errors will usually cause the script to fail. Both browsers will provide error messages which can be very helpful in debugging JavaScript.

JavaScript errors - Netscape Netscape has an excellent debugging tool built included. Any JavaScript errors will cause a message to appear in the status bar. To run the debugger, type javascript: in the location box (don't forget the colon). Even if you normally use IE when coding, it can be worthwhile to switch to Netscape to find JavaScript errors.

Errors Three types of errors: –Syntax errors –Run-time errors –Logic errors

Javascript Errors Syntax errors: code that the interpreter does not recognize document.writln(“Hello World”)

Javascript Errors Run-time Errors: occur when the interpreter encounters code that it cannot handle. For example: <a href="#" onclick="javascript:GeneralFunction()

Javascript Errors Logic Errors: occur when there is a flaw in the logic or design of the code. This logic flaw will result in the program executing incorrectly. For example: var multiplyres = 8 + 2; Document.write(“Eight divide by two is equal to “ + multipleres);

Debugging Javascript Another example of a logic error: var count = 1; while (count <= 10) { alert(“The number is ” + count); } Debugging describes the act of tracing and resolving errors in a program

Javascript Errors Do not assume that the line specified by an error message is the actual line problem in the program. You should use error messages only to find the general location of an error in a program and not as the exact indicator of an error Use Tracing (this is the examination of individual statements in an executing program). The alert() method provides one of the most useful ways to trace JavaScript code. You place an alert() method at different points in your program and use it to display the contents of a variable, an array, or the value returned from a function

DHTML To most people DHTML means a combination of HTML 4.0, Style Sheets and JavaScript. Dynamic HTML is really just an idea. It is not any of specific technology (such as JavaScript or Active Server Page). It uses a many different technologies such as JavaScript, VBScript, the Document Object Model (DOM), cascading style sheets – to create HTML that can change even after a page has been loaded into a browser.

DHTML Web pages created with CSS can have their properties changed on the fly (that is dynamically) through a scripting language such JavaScript. Adding DHTML to your Web site means that your pages can act and react to the user without continually returning to the server for more data.

DHTML Dynamic HTML is simply HTML that can change even after a page has been loaded into a browser. example: a paragraph could turn red when the mouse moves over it. In other word anything that can be done in HTML can be redone after the page loads. To use dHTML you need to be familiar with three different technologies: HTML/XHTML, style sheets, and JavaScript. With the DOM we got a document content model for HTML documents. Creating dynamic HTML documents would not be possible without the DOM.

DHTML Have you ever worked with two people who can't agree on anything, so you spend more time patching up their differences than getting real work done? If so, then you have all the experience needed to try to build Web pages using DHTML that work with both Microsoft's and Netscape's visions of the DHTML "standard."

DHTML NOTE: Netscape's vision of Dynamic HTML is a far cry from Microsoft's. Dynamic HTML pages built following Microsoft's model won't work in Navigator and vice versa Pages built following Microsoft's DHTML model (which uses VBScript) probably will not work in Navigator (which requires JavaScript) and pages built using Netscape's DHMTL model don't work well in IE. Both Netscape Navigator 4.0 and Internet Explorer (IE) 4.0 embrace Dynamic HTML. Do we have to use DHTML at all? Yes but we need to remember the Cross-Browser Compatibility

DHTML You should also note: Use lowercase event handler names for compatibility with Internet Explorer For example, use (onclick instead of onClick). IE can not handle mixed-case event handlers when they're used as an object property such as document.forms[0].button1.onclick = function Name elements using alphanumeric characters only: Navigator 4.0 occasionally ignores elements with non-alphanumeric characters in their names.