[译]App Framework 2.1 （1）之 Quickstart

提示：扫一扫查出行
【扫一扫了解最新限行尾号】
复制提示

最近有移动App项目，选择了 Hybrid 的框架Cordova 和 App Framework 框架开发。

本来应该从配置循序渐进开始写的，但由于上班时间太忙，这段时间抽不出空来，只能根据心情和兴趣，想到哪写到哪，前面的部分以后慢慢补上。

App Framework 前生是是叫 jqMobi 注意大家不要和 jQuery Mobile 混淆了，它们是两个不同的框架，一开始我还真混淆了0.01秒。

这里我先翻译一下Quickstart 部分，一是自己工作上用的上，二是也想顺便练练英文，最关键的是记忆力这段时间下降太多，每次看完不久又得重看一遍，写下来好歹看的顺溜一点。

英文原文在这里：http://app-framework-software.intel.com/documentation.php

Intro -> Quickstart ( 简介-> 快速入门 )

使用 App Framework 的时候，你只能使用W3C 制定的有效选择器。要查看所有的有效选择器列表，请点击 W3C。App Framework 不支持 jQuery 自己实现的自定义伪类（按：伪类应该是pseudo，官方写成了psuedo ，老外也有错别字啊）选择器(按：看这里)。接下来的一些例子，可以帮助开发者加快开发。

首先，把App Framework 插入进页面

App Framework 运行是通过把元素加入到一个“容器”（bucket）。所有容器内元素可以使用 App Framework api函数，这些函数能帮助加快开发。

使用 App Framework，你首先要学会用调用带参数的$()函数，那些参数可以是如下之一。

String - 可以是一个元素的id "#id", 类 ".foo", 组合 “#id .foo”，或者一个HTML 字符串"<div id='foo'></div>"

Element - 这会创建一个新的App Framework对象，并把这个Element元素加入到容器。

Array/Object 这会创建一个新的App Framework对象，并把那些数组的所有项加入到容器。

Function - 这会执行这个function函数当DOMContentLoaded 事件触发的时候，或者在实例产生后立即执行。

你也能通过一个额外（additional又被官方笔误成了addtional ，好歹也是全世界的人看，就不能仔细点吗）的参数，允许你在一个“上下文”的内部去搜索/过滤它。

$("#foo"); //找到 id="foo" 的元素;$("div"); //找到页面中所有的 div;$(".foo"); //找到 classname ="foo" 的所有元素;$("#foo span"); //找到 id="foo 中所有的span"

接下来，我们会找到所有列表想（<li>）并且把 foo类加入进去。

$("li").addClass("foo");

未完待续... 2012.10.12 晚

------------------------------------华丽的分割线，接上文------------------------------------------------

这里我们也可以通过ID去隐藏一个元素

$("#foo").hide();

这里我们可以找到class名为“removeme”的所有元素，并且从DOM中移除它们

$(".removeme").remove();

让我们看看一些更高级的用法。接下来，我们创建一个div，并追加它到body里面，同时注册一个lclick事件

var div=$("<div id="\"myNewDiv\""">This is some content</div>");
$(document.body).append(div);
div.bind("click",function(){
alert("I was clicked");
});