创建网站宝典英文文献翻译

AjaxAjax is short for ‘‘Asynchronous JavaScript and XML.’’ It is cross-platform. It is effectively open source. It is supported by these versions of the major browsers:■ Internet Explorer 5.0 and up■ Netscape 7 and up■ Firefox, Opera 8+■ Safari 1.2 a nd upAlthough it would be a stretch to call Ajax a new technology, and it is certainly not a programming language, it is an adaptive implementation of preexisting tools to provide an integrated, efficient new tool that can be used to make better, faster, more versatile Web applications.As you may know, Ajax, which is a mix or reformulation of existing technologies, facilitates server interaction with elements of a Web page. This, in turn, results in a more responsive application with lower bandwidth usage, and, hence, lower costs, resulting in a win-win situation for all concerned. It is also these features that make it attractive to the so-called Web 2.0 crowd and, those who are involved in software design and development for mobile handheld devices.Following are the major components of Ajax:■ JavaScript as the scripting language to call functions■ XMLHttpRequest is used for asynchronous data transfer from a server■XHTML and Cascading Style Sheets (CSS) are used for uniform encoding andpresentation cross-platform■ Document Object Model (DOM) is used for precise mapping and data display■ XML and XSLT (although, ironically, does not require use of XML for data fetch andtransfer)Ajax provides that slight margin of advantage to get ahead of the competition. But you must know when to use it, and then use it judiciously. Y ou would tend to defeat one of its appealing features — fast, efficient downloads of small segments of data —if you repeatedly called for updates or refreshes of information. Y ou would constantly be tying up system resources with repeated calls for new data, which may not be new at all (or necessary). Would you, for example, find it necessary to refresh the temperature field every 3 seconds on a weather page? It could be better done where a refresh of that field is only done when the new temperature does not equal the old temperature.Async (asynchronous) just means that requests and data may be exchanged across the Internet from the client Web page to the server and back at any time. The JavaScript object used to do this is called XMLHttpRequest. However, there is no requirement that the asynchronous content be formatted in XML.Let’s take a bit of a deeper look into the XMLHttpRequest object.XMLHttpRequestXMLHttpRequest is an object that has properties (which have values) and methods (which have values to be passed or implemented). Following are some uses of XMLHttpRequest that illustrate its lightning speed:■ Instant translation —This is to the extent that a concept such as a word is synchronously defined among the thousands of existing human languages.■ Smart shopping carts — Allows the user to add, remove, or edit products instantly.■ Immediate saving of data —Why force the user to click ‘‘Submit’’ when this objectallows direct saving of data?■ Server/client side validation — Allows you to validate data input on form controls asdata is typed into each element.Because it is used to send and receive data to the server, the XMLHttpRequest object has three components or properties associated with each instance of it:■ onreadystatechange■ readyState■ responseTextThe onreadystatechange property takes the value that has been returned by the server and stores it in the associated function(), which does the processing of the data returned by the server. This is a multistep process.The first step, the assignment of the function to the onreadystatechange property, follows the standard assignment format:xmlHttp.onreadystatechange=function(){Executable statements}ExecuteThe executable statements within the onreadystatechange property are contained within a selection structure that accepts one of five values from a server, each indicating a different state of the condition of the server in relation to the data request made. These returned values are stored within the readyState property. Each time the readyState property value changes, the onreadystatechange function() also executes. Those of you who are familiar with the OSI model might see a similarity to the request states and the analogous setup maintenance and teardown states of the Session Layer . . . or even Windowing.The current state of the object is determined by value in the readyState attribute. When there is a change (in other words, when a state transition occurs), the value in this field changes as follows:■ The value of 0 would indicate that XMLHttpRequest object is in proper mode to beconstructed.■ A value of 1 allows the send method to set up headers and send them to the serverusing the send() method.■ A value of 2 indicates that the request to the server has been sent.■ A value of 3 indicates the server is processing the request.■ A value of 4 indicates that the data request is complete. This does not necessarilymean that the data has been successfully received. It almost certainly has, but, in theevent that the unexpected occurs, you will see a flagged message come up informingyou of the failure.With the data successfully transferred from server to requestor object, you can then invoke the third property of the onreadystatechange object, which is the responseText property.When the readyState == 4 control of the program shifts downward, the actual data sent back from the server can be retrieved by the following generic syntax:Document.myForm.elementName=xmlHttp.responseText;This is then sent on to the Web page element that requested it without reloading the entire document. The responseText, of course, would be the response from the server in a string value.Ajax and the Mobile WebAjax may become a useful technology for mobile applications for the same reason that it is rapidly expanding in the more sedate market of desktop browsers: It is fast, efficient, bandwidthfriendly,and, because of this, will have cost benefits. Following is a list of browsers in themobile market that support the basic Ajax components of the XMLHttpRequest object and basic JavaScript is generally current:■ Internet Explorer Mobile (also known as Pocket Internet Explorer)■ Safari Mobile (iPhone)■ Opera Mob ile newer than v. 8.x, (but excludes Opera Mini)■ Minimo (Gecko-based)■ OpenWave newer than Mercury■ NetFront newer than v.3.4■ BlazerHowever appealing the features of Ajax might be to the mobile browser market, use alone will not drive the market. Applications developed for mobile devices would synergistically drive growth and would help Ajax achieve an unrivalled dominance in the Mobile Web-browsing experience.There are advances in mobile devices that really minimize the bandwidth demands put on wireless browser communication. Using widgets (which are either the graphical interface on devices, or the slimmed-down application, including content, or a combination of both icon and application) that can be installed onto the mobile device via phone, this provides the focus and simplification required for ease of client use and ease of access to whichever applications are needed because so much of the content is preinstalled.In short, mobile widgets often use components of Ajax, namely the asynchronous data transfer. Some observers prognosticate that, since widgets for mobile devices use one of the key features of Ajax (async data transfer) and since iPhone (which is very popular) also uses Ajax-based widgets, then usage is sure to grow.Ajax Quick ReferenceThe following provides a quick reference for key items discussed in this chapter: ■ Ajax is composed of the existing technologies of HTML, JavaScript, XML, CSS, andasynchronous data transfer.■ XMLHttpRequest allows a Web page to communicate direct ly with a server andupdate the page (page element) even after the page has been loaded.■onreadystatechange property holds the latest value retrieved from the server’s response to the readystate request sent out. These values can be 0 to 4, and reflectvarious states of readiness for the data request sent.■ xmlReq.open(Head, url, async, username, password) is the generic request format.■ xmlReq.send() is the generic send format.■document.getElementById(‘someElement’).innerHTML =xmlHttp.responseText; isused to send retrieved data to a Web page element for which the request wasoriginated.■ Different browsers have different versions of the XMLHttpRequest object.Ajax是“异步JavaScript和XML”的简称。