访问后台数据库有多6，看看这里便知

相信使用爱码哥的小伙伴们对原生控件已经很熟悉了，在app开发中，原生控件能够帮助开发人员完成一个个精美的页面，给app奠定一个好的基础。然而，完成这些美观的静态页面只是开发app的开始，页面的交互和调用程度、用户体验和流畅的性能才是app的重中之重。这些与脚本功能息息相关，比如界面数据都是来自数据库的动态数据，用户输入的数据能够以同步和异步的方式入库，这些都需要JavaScript脚本来完成。

下面我们一起学习iMAG客户端访问后台数据库的两种方式。

通过后台程序读取数据库数据，再用JSP（需要部署Java本地开发环境），ASP（需要部署.Net本地开发环境）等脚本输出iMAG标签，这种方式类似于动态网页。如：

<?xml version="1.0" encoding="utf-8"?>
<imag>
<page>
<title>
<center><label><%=title%></label></center>
</title>
<content>
<list>
<%for (int i = 0; i < items.length; i++) {%>
<item accessory="indicator" href="<%=items[i][0]%>">
<label><%=items[i][1]%></label>
</item>
<%}%>
</list>
</content>
</page>
</imag>

上面的例子通过JSP输出iMAG页面，title和items都是来自数据库的数据。

另一种方式是通过 $http.get()和$http.post()方法来获取服务器端的数据，这种方式类似于Ajax。

<imag>
<script>
<![CDATA[
$page.onload = function() {
$http.get('http://www.imagapp.com/download/data/ajax_test.json', function(data) {
var obj = JSON.parse(data);
$('title').text = obj.title;
var listXml = '<list>';
for (var i = 0; i < obj.items.length; i++) {
listXml += '<item accessory="indicator" href="' + obj.items[i][0] + '">' +
'<label>' + obj.items[i][1] + '</label>' +
'</item>';
}
listXml += '</list>';
$('data_list').update(listXml);
});
}
]]>
</script>
<page>
<title>
<center><label id="title"></label></center>
</title>
<content>
<list id="data_list">
</list>
</content>
</page>
</imag>

上面的例子通过http请求方式加载数据，obj.title和obj.items都是来自远程服务器的JSON数据。JSON数据可以在云平台的模拟数据中创建。

爱码哥邀你一起智造app！