[AFUI]App Framework Quickstart
---------------------------------------------------------------------------------------------------------
当使用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的更多相关文章
- [AFUI]App Framework Plugins
---------------------------------------------------------------------------------------------------- ...
- [AFUI]App Framework
---------------------------------------------------------------------------------------------------- ...
- [译]App Framework 2.1 (1)之 Quickstart
最近有移动App项目,选择了 Hybrid 的框架Cordova 和 App Framework 框架开发. 本来应该从配置循序渐进开始写的,但由于上班时间太忙,这段时间抽不出空来,只能根据心情和 ...
- [Learn AF3]第三章 App Framework 3组件之Panel:afui的核心
Panel,afui的核心组件 组件名称:Panel 使用说明:按照官方的说法,panel组件是af3的“核心(heart of the ui)”,panel用于构造应用中独立的内容展示区域, ...
- [译]Intel App Framework 3.0的变化
App Framework 3.0 原文 IAN M. (Intel) 发布于 2015-02-11 05:24 我们高兴地宣布App Framework 的新版本3.0发布了.你可以获得最新的代码 ...
- 【App FrameWork】页面之间的参数传递
若应用中有多个页面,这时2个页面之间可能需要进行参数传递.那么如何来实现呢? 首先想到的就是URL参数传递的方式,如:在panel里设置属性 data-defer="Pages/Shake. ...
- 【App FrameWork】框架的页面布局
之前主要用JqueryMobile+PhoneGap的模式开发移动应用,但JQueryMobile自身存在的硬伤太多,如加载速度缓慢,页面转场白屏.闪烁,头尾部导航浮动问题,页面滚动等等,用户体验效果 ...
- [Learn AF3]第七章 App framework组件之Popup
AF3的弹出对话框Popup 组件名称:Popup 是否js控件:是,$.afui.popup 说明:af3中的popup和af2中相比变化不大,依然是通过插件popup来实现的 方法 ...
- [Learn AF3]第四章 App framework组件之Button
Button 组件名称:Button 是否js控件:否 使用说明:如果说panel组件是af3的“核心(heart of the ui)”,那么Button就是af中的五虎上将之 ...
随机推荐
- bzoj1006 神奇的国度
Description K国是一个热衷三角形的国度,连人的交往也只喜欢三角原则.他们认为三角关系:即AB相互认识,BC相互认识,CA相互认识,是简洁高效的.为了巩固三角关系,K国禁止四边关系,五边关系 ...
- linux下进程、端口号相互查看方法
linux下通过进程名查看其占用端口: 1.先查看进程pid ps -ef | grep 进程名 2.通过pid查看占用端口 netstat -nap | grep 进程pid 例:通过nginx进程 ...
- Centos7和win7双系统调整默认启动
centos7之后都上grub2了,所以你要更改默认启动项什么的就不能像以前一样去改 /etc/grub.conf 当然你更不能去改/etc/grub2.conf 上了grub2之后,在设计有意规避让 ...
- ios5 中文键盘高度变高覆盖现有ui问题的解决方案(获取键盘高度的方法)(转载)
背景: ios5之前,iphone上的键盘的高度是固定为216.0px高的,中文汉字的选择框是悬浮的,所以不少应用都将此高度来标注键盘的高度(包括米聊也是这么做的). 可是在ios5中,键盘布局变了, ...
- Linux系统默认服务建议开启关闭说明列表
服务名称 功能简介 建议 acpid 电源管理接口.如果是笔记本用户建议开启,可以监听内核层的相关电源事件. 开启 anacron 系统的定时任务程序.cron的一个子系统,如果定时任务错过了执行时间 ...
- 个人卡付款sql
select arap_djfb.billdate as 单据日期, bd_corp.unitname as 付款单位, arap_djfb.zy as 付款摘要, bd_cubasdoc.custc ...
- 黄聪:wordpress伪静态的原理
首先起作用的是配置文件的.htaccess 中的 RewriteEngine OnRewriteBase /RewriteRule ^index\.php$ - [L]RewriteCond %{RE ...
- Hibernate中get和load的区别
get获取的对象立即执行sql查询数据库中当前实体表中的数据,如果外键关联的其他实体表如果配置了懒加载关闭,则也会查询出外键关联的其他实体表中的数据,否则外键关联的其他实体表则以代理对象表示(称其为代 ...
- 斑马打印机网卡ZebraNet配置(有线)
实图: 抽象图: 说明: 1.并口,用于连接斑马打印机一端 2.网络连接状态指示灯 3.打印状态指示灯 4.测试按钮,在连接打印机的情况下,按下此键,会打印出网卡信息. 5.网线接口 按下测试按钮之后 ...
- 转载__Android-屏幕适配需要注意的地方
1.尽量使用线性布局(LinearLayout)和相对布局(RelativeLayout),不要使用绝对布局. 2.尽量使用dip和sp,不要使用px. 3.为不同的分辨率提供不同的布局文件和图片. ...