An introduction to Ajax.
When these technologies are combined in the Ajax model, web applications are able to make quick, incremental updates to the user interface without reloading the entire browser page. This makes the application faster and more responsive to user actions.
- Getting Started
- This article guides you through the Ajax basics and gives you two simple hands-on examples to get you started.
- Using the XMLHttpRequest API
XMLHttpRequestAPI is the core of Ajax. This article will explain how to use some Ajax techniques, like:
- Fetch API
- The Fetch API provides an interface for fetching resources. It will seem familiar to anyone who has used
XMLHTTPRequest, but this API provides a more powerful and flexible feature set.
- Server-sent events
- Traditionally, a web page has to send a request to the server to receive new data; that is, the page requests data from the server. With server-sent events, it's possible for a server to send new data to a web page at any time, by pushing messages to the web page. These incoming messages can be treated as Events + data inside the web page. See also: Using server-sent events.
- Pure-Ajax navigation example
- This article provides a working (minimalist) example of a pure-Ajax web site composed only of three pages.
- Sending and Receiving Binary Data
responseTypeproperty of the XMLHttpRequest object can be set to change the expected response type from the server. Possible values are the empty string (default),
responseproperty will contain the entity body according to
responseType, as an
JSON, or string. This article will show some Ajax I/O techniques.
- The Extensible Markup Language (XML) is a W3C-recommended general-purpose markup language for creating special-purpose markup languages. It is a simplified subset of SGML, capable of describing many different kinds of data. Its primary purpose is to facilitate the sharing of data across different systems, particularly systems connected via the Internet.
- Parsing and serializing XML
- XPath stands for XML Path Language, it uses a non-XML syntax that provides a flexible way of addressing (pointing to) different parts of an XML document. As well as this, it can also be used to test addressed nodes within a document to determine whether they match a pattern or not.
FileReaderAPI lets web applications asynchronously read the contents of files (or raw data buffers) stored on the user's computer, using
Blobobjects to specify the file or data to read. File objects may be obtained from a
FileListobject returned as a result of a user selecting files using the
<input>element, from a drag and drop operation's
DataTransferobject, or from the
mozGetAsFile()API on an
- HTML in XMLHttpRequest
- The W3C XMLHttpRequest specification adds HTML parsing support to
XMLHttpRequest, which originally supported only XML parsing. This feature allows Web apps to obtain an HTML resource as a parsed DOM using
- Other resources
- Other Ajax resources you may find useful.
- Alternate Ajax Techniques
- Most articles on Ajax have focused on using XMLHttp as the means to achieving such communication, but Ajax techniques are not limited to just XMLHttp. There are several other methods.
- Ajax: A New Approach to Web Applications
- Jesse James Garrett, of adaptive path, wrote this article in February 2005, introducing Ajax and its related concepts.
- A Simpler Ajax Path
- "As it turns out, it's pretty easy to take advantage of the XMLHttpRequest object to make a web app act more like a desktop app while still using traditional tools like web forms for collecting user input."
- Ajax Mistakes
- Alex Bosworth has written this article outlining some of the mistakes Ajax application developers can make.
- Tutorial with examples.
- XMLHttpRequest specification
- W3C Working draft
- View Mozilla forums...
- Toolkits and frameworks
- Firebug - Ajax/Web development tool
- AJAX Debugging Tool
- Flash/AJAX Integration Kit
- A Simple XMLHTTP Interface Library
- Ajax poller script
- Ajax Chat Tutorial
- RSS Ticker with Ajax
- Create your own Ajax effects
- Ajax: Creating Huge Bookmarklets
- Ajax: Hot!Ajax There are many cool examples