New HTML5 features supported in iOS 4.2

IOS4.2 supportHTML5The new feature is the content to be introduced in this article. We will go directly to the topic if we don't accept it too much. It is said thatIOS4.2 released, allIPhoneIPod, iPad, and others can all be updated for free. Fortunately, this versionIOSPairHTML5The support for new features has been greatly upgraded, including support for WebSockets and Accelerometer, new events, support for printing, new JavaScript data types, and better support for SVG.

In fact, Apple has not updated the Safari document. The information here is only based on the JavaScript research and testing of Safari (Note: Safari in this article refers to the Safari browser in iOS Mobile devices, excluding Safari in PCs and Mac hosts. Specifically, the new features are as follows:

Supports accelerators through the DeviceOrientation API

HTML5 WebSocket API

HTML5 form support enhancements

Print support

New JavaScript Data Type

New DOM Event

Enhanced support for SVG and Canvas

Accelerator support

You may already know that iOS devices have acceleration sensors (and other devices such as magnetic and gyroscope), but until now, Web developers have no permission to operate these sensors. Safari now supports the DeviceOrientation API (W3C draft). However, although it seems that all the APIs are supported (including ondeviceorientation and ondevicemotion events), during the test, I can only successfully use accelerator data.

If you already have a device for iOS 4.2, you can use the Safari browser to access ad. ag/jtjdmj for self-testing.

To detect 50 Changes in the accelerated counting data every second, you need to listen to the ondevicemotion event on the window global object, and then use the accelerationIncludingGravity attribute on the DeviceOrientationEvent parameter. It has three values: x, y, and z, representing the acceleration g (gravity, gravity) on each coordinate respectively ). You can use the accelerated count in a game, effect, or CSS animation.

 
 

  
  
 window.ondevicemotion = function(event) {  
  
  
// event.accelerationIncludingGravity.x  
  
  
// event.accelerationIncludingGravity.y  
  
  
// event.accelerationIncludingGravity.z  
  
  
}  
 
 

WebSockets

Another major update is support for WebSockets. WebSockets is a draft W3C HTML5 API that allows JavaScript to connect to a server using an open two-way, dual-way, full-working method and use TCP sockets. This is a good message for chat and real-time applications, because it can greatly reduce AJAX periodic calls.

You will need a server that can understand the new WebSocket protocol through an HTTP handshake. If the server does not support WebSocket or because of proxy/gateway, you will need to rely on a fallback mechanism.

HTML5 form support

In fact, webkit supports HTML5 forms relatively well. Now Safari in iOS 4.2 supports the required attribute and the invalid CSS pseudo class. In this case, the following code shows a text box that displays a green background when entered correctly, but a yellow background when entered incorrectly.

 
 

  
  
<style> 
  
  
input {  
  
  
background-color: green;  
  
  
color: white;  
  
  
}  
  
  
input:invalid {  
  
  
background-color: yellow;  
  
  
}  
  
  
</style> 
  
  
<input type="text" required>AJAX2 
 
 

The object named FormData allows us to easily use Ajax to produce form data.

Print support

IOS4.2 introduces AirPrint, an infinite print solution. That is to say, we can now use window. print to call the print dialog box in Safari.

New JavaScript Data Type

Safari now supports binary classes (Blob Class) and a set of many integer types, such as Float32Array, Int8Array, Uint8Array, Int16Array Unit16Array, Int32Array, and Uint32Array. For more information, visit the Firefox website.

New DOM Event

In the new queue event, we can now use the new onhashchange event in HTML 5 to detect changes after the URL hash (#) in the AJAX webapp, and the invalid, onbeforeload, and onpopstate events in the HTML5 draft Specification.

Now, we can also use window. captureEvents and window. releaseEvents to listen for events in the global method.

Enhanced support for SVG and Canvas

IOS supports SVG and inline SVG (using svg labels) as independent files ). Now we can directly create an SVG document in our document-use more than 20 SVG ___ classes, such as SVGDocument, SVGImage, etc...

Currently, Canvas supports imageData data-type, a method for operating images in pixels from JavaScript.

Others

Supports a styleMedia attribute of the window global object.

G API (that is, part of WebGL.

A global RGBColor Constructor

Summary: AboutIOS4.2 supportHTML5We hope this article will help you with the introduction of new features. For more information, see edit recommendations.