This week, because the department picked up a small HTML5 app case, I took this project on Android development. More than the project needs, I want to do the HTML5 app myself, because I've been curious about this new platform for a long time. For a long time, but did not meet the project practiced hand just before.
Well, let's start with the main content of this blog post. Speaking of HTML5 believe that everyone is not unfamiliar, indeed this concept has been in the domestic fire for some time, but everyone to HTML5 specific can do, in the end where I should use HTML5 it? And then what's the HTML5 compared to the previous version? And listen to me slowly come, first HTML5 mainly used for the web side, because HTML5 itself is a kind of markup language evolved from HTML, but compared to the previous version HTML5 some of the powerful browser-supported tags, so we can use more convenient, More efficient labeling for more complex functions. So the bottom line is that some of the foreign standards organizations for the actual needs, in the original HTML version of the base to add new tags, while the development of a new set of standards, and then the major browse vendors in accordance with this set of guidelines to support the function of response. So what are the pros and cons of using HTML5 to develop and use native language development for our app developers? First of all, I always worry about experiencing problems, because after all, there is a. html page displayed in a mobile browser. Without some of the control libraries provided in the native framework, and without some native SDK support, does that mean that the user has no native app experience? With this project development process, I found that HTML5 in the development of the app, there is absolutely no problem. The user experience can be almost done, and HTML5 developed by the app no matter what platform style consistent, a set of code, a development, you think the development cost can be reduced how much?
First in the new HTML page below code <meta charset= "Utf-8" > below, add the following code: <meta name= "viewport" content= "Width=device-width, Initable-scale=1,user-scalable=1, what does this code mean? Let's take a look at viewport, which was developed by Apple, and we understand that this HTML page represents an app page that is as wide as the width of the screen, and that the scale is 1 and does not allow the user to zoom. Through this code we reach when the HTML page in the mobile browser display, it is the size of the mobile phone screen to display. Then we can do a lot of things on this HTML page, for example, we want to add a page title, what should we do? First, add the following style file of the jquery Mobile framework to the page:
<link rel= "stylesheet" href= "Http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css" >
<script src= "Http://code.jquery.com/jquery-1.8.3.min.js" ></script>
<script src= "Http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js" ></script>
After adding these three sentences, we can add the following code between the <body></body> tags on the current page:
<div data-role= "Page" >
<div data-role= "Header" >
</div>
<div data-role= "Content" >
</div>
</div>
I'm sure you can read the div tag, but what does data-role mean? This is the property of the jquery mobile framework used to set the label role, first we set the outermost div to page (that is, the entire page), and then the outer layer has header,content that corresponds to the title and content of the page respectively. You can hit the above code into an HTML, and then put it on the server through the mobile browser to access a bit to know. Of course, there are a lot of other tags, attributes, events in jquery Mobile that we can use to implement a lot of interactive pages.
I am in the process of learning, the most interesting to me is: The front desk HTML user input information how to get to the background, while encapsulating into the HTTP message sent to the server, and then parse out the data and how to return to the HTML page for the reality? I believe that if you have a service-side development experience of the friend this curious point, will feel very funny. Isn't it just a form that submits forms, and then uses JavaScript to extract the data we need from HTML-submitted parameters? Yes, if I understand this, I believe a lot of buddies will be able to develop HTML5 more confidently. In fact, to a certain extent, the development of HTML5 is in the development of the server Web site, but we in the development process will use the client to develop some of the necessary design thinking, user experience it. Here, we can easily understand that the development of HTML5 should have the technical basis. We can use: php,java,c# as long as the user can accept the request, give the user response in theory can be used to develop the HTML5 app.
Just turned from the native client, there may be some page layout is very confusing, because the page layout to a large extent can not find the native language of the law, sometimes very simple page logic, it may be a great effort to get out. Second, we may respond to the service-side HTTP request, the response way also must have a certain understanding, so as to better parse the data, display page.
Well, let's talk about it, technical details can be explored in the actual project.
Learn HTML5 App project development
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
