Weekend MS CS ProgramInternet and Web
TechnologiesCOT 5930
Web Project Development - Ajax
Dr. Roy Levow, Associate Chair & Professor
Email: [email protected] Phone: 954-236-1170
Web: http://www.cse.fau.edu/~roy
Lesson Plan
1. Introduction to Ajax2. Constituent Technologies
A. XHTMLB. CSSC. JavaScriptD. DOME. XML, XLS, XSLTF. XMLHttpRequest
3. Simple Ajax Examples
Ajax
Asynchronous JavaScript And XML
Provides a framework for the development of web pages that are Interactive Highly dynamic
Small transfers that update current page provide faster, smoother response
Ajax Site Example
Google Suggest (Beta)http://www.google.com/webhp?complete=1&hl=en
Google Mapshttp://maps.google.com/
Gmailhttp://gmail.google.com/
Google Page Creator (Beta) http://pages.google.com/
Pros and Cons of Ajax: Pros Interactivity
Achieved by direct manipulation of DOM
Quick updates using incremental data loads
Portability Open standards JavaScript is supported by most
current browsers
Pros and Cons of Ajax: Cons Inefficiency
Interpreted code Overhead of XML transfer (larger files)
Portability Requires JavaScript Also requires ActiveX on IE Inconsistent rendering
Issues with response to Back button
Accessibility issues
Alternative Technologies
Macromedia Flash Highly interactive Prepackaged “movies” Requires plugin
Java Web Start Java application interacts between
client and server Microsoft .NET
Ajax Component Technologies XHTML CSS JavaScript Document Object Model (DOM) XML and XSLT XMLHttpRequest
Ajax Design Principles
Highly interactive Smooth responses
Separation of Data Presentation Program logic
Ajax Tools
A variety and growing number of tools have been developed to support Ajax technology Provide consistent development
environment Hide XML and XMLHttpRequest
complexity Ruby on Rails / Ajax on Rails Eclipse Ajax Tool Framework
Cascading Style Sheets (CSS) Provide for separation of format
from content Tutorial and Standard at
W3Schools
Domain Object Model (DOM) Dynamic access to elements of
web page in browser Support for XHTML, XML, CSS Introduction to DOM
W3 Schools XML DOM Tutorial Using DOM for DHTML
Ryan's DHTML Tutorial, Part 4
XML
Extensible Markup Language Provides basic structure for
representation of data and other structured documents
Tutorial and Standard at W3Schools
Review of XML Namespaces
XSL
Extensible Stylesheet Language More than just stylesheets For application to XML
XSLT for transforming XML documents (into XHTLM)W3 Schools XSLT Tutorial
XPath for selecting parts of an XML document W3 Schools XPath Tutorial
References
1. Wikipedia – Ajax programminghttp://en.wikipedia.org/wiki/AJAX_%28programming%29
2. Ajax information and tutorials at Fiamingadev http://dev.fiaminga.com/
3. Ajax Bloghttp://ajaxblog.com/
4. AjaxLessons.comhttp://www.ajaxlessons.com/
5. W3Schools tutorials and standardshttp://www.w3schools.org/
Top Related