backbone 模板 html,【WebApp】离线webapp backbone模板，文件加载在不同浏览器中的表现...

index.html

html>

webapp

main.js

$.get("./template/item-template.html",function(data){

console.info(data);

// alert(data);    // 用于在ie6和8中进行测试

$(".loadingHtml").append(data);

});

item-template.html

......

---------------------------------------------------------------

【PC端-windows】/如不做特殊说明，皆为在线测试/

safari：可以说最给力了；可以console。info出item-template.html中的html，还可以将html插入到index.html中。见图：

chrome:/在线测试/正常打印和插入，见safari截图。不多话。

/本地测试/，报错提示如下：XMLHttpRequest cannot loadfile:///C:/Users/Administrator/Desktop/Backbone.js%20Todos/template/item-template.html. Origin null is not allowed by Access-Control-Allow-Origin.

firefox：

/在线测试/正常打印和插入，见safari截图。不多话。/本地测试/打印出Document对象，无内容插入到index.html中。如图：

ie9:不错，这次跟safari的表现形式一样。可以打印出数据，也可以插入到主页面中。(同safari一样，打印出来的数据，跟html中的结构样式一模一样，连空格和换行都照样搭出来了。)见图：

ie6:有弹出框，可以插入。如图：

ie8：无弹出框，可插入。见图：

---------------------------------------------------------------

【移动端】

/在线测试/【台电八寸平板】安卓系统、 内置uc浏览器。对于台电的外形触感体验等等等等，我无力吐糟。正常弹出和插入数据。截图就懒得上了。(热不住再说一句，这玩意，alert弹出框，内容那么长，竟然只能显示一部分，不可以上下滑动，我勒个去。)

【ipad mini】ios5+系统、内置safari浏览器。正常弹出和插入数据。截图免。

【三星note2】安卓4.0+、uc浏览器和内置浏览器。皆可正常弹出和插入。截图免。

/套在Phonegap中，在真实环境下测试/【台电八寸平板】安卓系统、 内置uc浏览器。无压力，正常显示。

---------------------------------------------------------------

使用backbone时，由于模板太多，所以考虑将模板拆分到不同的html文件。在启用backbone框架之前，先生成模板。具体方法如下：(简略例子)

// 如果是在线webapp应用，则可以直接采用这种方式来获取template模板html文件中的内容

// 已经通过测试。具体测试报告见oschina

// 外层可以直接套backbone框架

// 生成所有模板之后，再启动backbone框架，可以考虑在启动之前加启动动画，等等。

// 后期可以考虑将页面中的js文件全部在main.js中导入进入。可以考虑换成js原生态写法，不依赖插件。

var tempName = ["item","stats"];

var tempStr = {};

var j = 0;

var callback = function(data){

tempStr[tempName[j]] = data;

console.info(tempStr[tempName[j]]);

j++;

if (tempName[j]){

$.get("./template/" + tempName[j] + "-template.html",function(data){

callback(data);

});

} else {

$("body").append("");

}

};

$.get("./template/" + tempName[j] + "-template.html",function(data){

callback(data);

});