IOS 4.2 safari supports HTML5 feature updates

ArticleDirectory

• Accelerator support
• Websockets
• HTML5 form support
• Ajax2
• Print support
• New JavaScript Data Type
• New DOM Event
• Enhanced support for SVG and canvas
• Others

Articles from safari on iOS 4.2: accelerometer, websockets, SVG, ajax2 & better HTML5 support
Please respect copyright. For Reprinted Information, please note that it is from front-end observation.

Well, it is said that IOS 4.2 has been released, and all iPhone, iPod, and iPad products can be updated for free. It is gratifying that this version of IOS has greatly upgraded the support for new HTML5 features, including support for websockets and accelerometer, new events, support for printing, new JavaScript data types, and better SVG support.

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 APIs are supported (includingOndeviceorientationAndOndevicemotionEvent), but in the test, I can only successfully use the 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.

1 2 3 4 5

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 has relatively good support for HTML5 forms. Now safari in IOS 4.2 is supported.RequiredAttributes and: InvalidCSS pseudo class. In this case, the followingCodeThe text box displays the green background when the input is correct, but the yellow background when the input is incorrect.

<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 useWindow. PrintTo 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 lifecycle events, we can now use the new HTML 5OnhashchangeEvents are used to detect changes after the URL hash (#) in Ajax webapps andInvalid,OnbeforeloadAndOnpopstateEvent.

Now, we can also useWindow. captureeventsAndWindow. releaseeventsTo listen to 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 one global window object.StylemediaAttribute
• One typeWebglrenderingcontextClass availability, part of the 3D drawing API (webgl.
• A globalRgbcolorConstructor

from: frontend observation