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

当使用App Framework,你只能使用W3C可用的选择器。可以去W3C查看完整的列表。不支持如jQuery中创建的自定义伪选择器。下面是一些App Framework能帮助你加速开发的例子。

第一步,引入App Framework到你的页面。

<script src="//cdn.app-framework-software.intel.com/2.1/appframework.min.js" type="text/javascript"></script>

App Framework通过添加元素到一个“存储桶”来工作。所有在“存储桶”的元素可以利用特别的App Framework api方法来帮助加速你的开发。

使用App Framework,你首先调用包含一个参数的$()方法。这个参数可以是下面的一个。

  • 字符串 - 这可以是一个id元素"#id",类名".foo",一个联合体"#id .foo",或一个用来创建对象的HTML字符串"<div id='foo'></div>"
  • 元素 - 这将创建一个新的App Framework对象和添加元素到“存储桶”。
  • 数组/对象 - 这将创建一个新的App Framework对象和添加选项到“存储桶”。
  • 方法 - 当DOMContentLoaded触发时 或 紧接着在此之后,它将执行一个方法。

你可以同样传递一个附加参数"Context"来允许你搜索/过滤。

下面是一些查找元素的基础样本。

$("#foo"); //find the element with id="foo";

$("div"); //Find all the divs on the page;

$(".foo"); //Find all elements that have the classname ="foo";

$("#foo span"); //Find all span's that exist inside the element with id="foo"

下面,我们找所有的列表元素(<li>)并添加一个"foo"类 给它们。

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

这儿我们通过id找一个"foo"元素并隐藏它。

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

这儿我们找所有类名为"removeme"的DOM并移除它。

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

让我们看一些能做的更高级的东西。下面,我们将创建一个div,把它追加到body中并注册一个点击事件。

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

@黑眼诗人 <www.farwish.com>

译自:http://app-framework-software.intel.com/documentation.php#intro/quickstart

[AFUI]App Framework Quickstart的更多相关文章

  1. [AFUI]App Framework Plugins

    ---------------------------------------------------------------------------------------------------- ...

  2. [AFUI]App Framework

    ---------------------------------------------------------------------------------------------------- ...

  3. [译]App Framework 2.1 (1)之 Quickstart

    最近有移动App项目,选择了 Hybrid 的框架Cordova  和  App Framework 框架开发. 本来应该从配置循序渐进开始写的,但由于上班时间太忙,这段时间抽不出空来,只能根据心情和 ...

  4. [Learn AF3]第三章 App Framework 3组件之Panel:afui的核心

    Panel,afui的核心组件 组件名称:Panel     使用说明:按照官方的说法,panel组件是af3的“核心(heart of the ui)”,panel用于构造应用中独立的内容展示区域, ...

  5. [译]Intel App Framework 3.0的变化

    App Framework 3.0 原文 IAN M. (Intel) 发布于 2015-02-11  05:24 我们高兴地宣布App Framework 的新版本3.0发布了.你可以获得最新的代码 ...

  6. 【App FrameWork】页面之间的参数传递

    若应用中有多个页面,这时2个页面之间可能需要进行参数传递.那么如何来实现呢? 首先想到的就是URL参数传递的方式,如:在panel里设置属性 data-defer="Pages/Shake. ...

  7. 【App FrameWork】框架的页面布局

    之前主要用JqueryMobile+PhoneGap的模式开发移动应用,但JQueryMobile自身存在的硬伤太多,如加载速度缓慢,页面转场白屏.闪烁,头尾部导航浮动问题,页面滚动等等,用户体验效果 ...

  8. [Learn AF3]第七章 App framework组件之Popup

    AF3的弹出对话框Popup 组件名称:Popup 是否js控件:是,$.afui.popup     说明:af3中的popup和af2中相比变化不大,依然是通过插件popup来实现的     方法 ...

  9. [Learn AF3]第四章 App framework组件之Button

    Button    组件名称:Button     是否js控件:否     使用说明:如果说panel组件是af3的“核心(heart of the ui)”,那么Button就是af中的五虎上将之 ...

随机推荐

  1. Linux下编译Boost

    编译环境 操作系统: Red Hat Enterprise Linux Server release 5.4 64-bit 编译工具: gcc (GCC) 4.1.2 20080704 (Red Ha ...

  2. php缓存数组到文件

    php缓存数组到文件 static function getIDs($kemuid) { $cachefile="cache/" . $kemuid . ".cache& ...

  3. 目前已经知道的乐视所有产品各个型号的强刷方法!更新X50

    http://ui.letv.com/thread-43668-1-1.html 很多网友买来电视/盒子仅仅要看,还要折腾这个电视,有时候不小心把系统折腾死了,肿么办?危难之中显身手,我的神帖来了,敬 ...

  4. PHP转换UTF-8和GB2312的URL编码(转)

    目前WEB的应用中, UTF-8编码和GB2312编码是并存在的,例如百度(baidu.com)和谷歌(google.com)的URL编码分别是GB2312编码和UTF-8编码.由于编码并存引起的乱码 ...

  5. HDU 1532 Drainage Ditches EK算法 flod算法

    题意:输入m n, m是边数,n是点数. 接下来m行: 起点,终点,容量.求以 1 为源点, n为汇点的最大流. #include<stdio.h> #include<string. ...

  6. 如何刪除GitHub中的repository

    如何刪除一github中的repository,這本該是個非常簡單的操作,可一開始搜的時候,有不少文章比較含糊.這裡就記錄下來吧. 1.訪問https://github.com/settings/pr ...

  7. error-iis-Service Unavailable

    Service Unavailable Service Unavailable HTTP Error 503. The service is unavailable.

  8. Porlet标准:JSR168/JSR286/WSRP(转载)

    From:http://www.iteye.com/topic/620213 Portlet标准主要是JSR168,JSR286和WSRP. JSR168因为比较早,所以大部分的Portal都支持这个 ...

  9. 检测是否安装有sim卡

    ios7测试ok [CTSIMSupportGetSIMStatus() isEqualToString:kCTSIMSupportSIMStatusNotInserted]可以判断是否插入了sim卡 ...

  10. Spring读取配置文件

    在spring中可以通过下面的方式将配置文件中的项注入到配置中 <bean class="org.springframework.beans.factory.config.Proper ...