Path: blob/main/files/en-us/web/guide/ajax/index.md
6552 views
-------
Guides
-
{{ListSubpagesForSidebar("/en-US/docs/Web/Guide")}}
Getting Started
Asynchronous JavaScript and XML, or Ajax, is not a technology in itself, but rather an approach to using a number of existing technologies together, including HTML or XHTML, CSS, JavaScript, DOM, XML, XSLT, and most importantly the {{domxref("XMLHttpRequest")}} object. 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.
Although X in Ajax stands for XML, {{glossary("JSON")}} is preferred because it is lighter in size and is written in JavaScript. Both JSON and XML are used for packaging information in the Ajax model.
Documentation
: This article guides you through the Ajax basics and gives you two simple hands-on examples to get you started.
: The {{domxref("XMLHttpRequest")}} API is the core of Ajax. This article will explain how to use some Ajax techniques, like:
Submitting forms and upload binary files – in pure Ajax, or using {{domxref("FormData")}} objects
Using Ajax within Web workers
: This article provides a working (minimalist) example of a pure-Ajax website composed only of three pages.
Sending and Receiving Binary Data
: The
responseTypeproperty of theXMLHttpRequestobject can be set to change the expected response type from the server. Possible values are the empty string (default),arraybuffer,blob,document,json, andtext. Theresponseproperty will contain the entity body according toresponseType, as anArrayBuffer,Blob,Document,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 kinds of data. Its primary purpose is to facilitate the sharing of data across different systems, particularly systems connected via the Internet.
: How to parse an XML document from a string, a file or via JavaScript and how to serialize XML documents to strings or files.
: 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.
{{domxref("FileReader")}} API
: The
FileReaderAPI lets web applications asynchronously read the contents of files (or raw data buffers) stored on the user's computer, using {{domxref("File")}} or {{domxref("Blob")}} objects to specify the file or data to read. File objects may be obtained from a {{domxref("FileList")}} object returned as a result of a user selecting files using the {{HTMLElement("input")}} element, or from a drag and drop operation's {{domxref("DataTransfer")}} object.
: The XMLHttpRequest specification adds HTML parsing support to {{domxref("XMLHttpRequest")}}, which originally supported only XML parsing. This feature allows Web apps to obtain an HTML resource as a parsed DOM using
XMLHttpRequest.
Related technologies
While Ajax is still useful, other APIs have been developed since 2005 that enable similar functionality, including the Fetch API and server-sent events.
: The Fetch API provides an interface for fetching resources. It will seem familiar to anyone who has used {{domxref("XMLHTTPRequest")}}, but this API provides a more powerful and flexible feature set.
: 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.
See also
: WHATWG Living Standard