自己总结的APICloud便于查找小文档

空闲的时候总结的笔记,看一下apijs,api.js 是由 APICloud 官方为您提供的辅助脚本框架,遵循主流前端框架 jQuery 的使用习惯。

api.css 所有手机上表现一致。

AUI 前端布局框架。

swipe.js 实现多屏切换、轮播图等功能。

dot.js 使用 Web 方式显示数据列表时,使用 js 模板可以有效提高开发效率和运行体验,通过简单的自定义语法即可完成复杂布局的列表开发。

SHA1.js 算法进行数据加密。

APICloud-rest.js 进行数据云操作。

http://knockoutjs.com/

应用包结构

  • “config.xml”是配置文件,

  • “index.html”是启动页面,

  • “icon”为图标文件目录,

  • “launch”为启动图片目录

config.xml 配置文件

  • “id”: 必填,应用ID,由云服务器自动分配。它是该应用的唯一标识。

  • “version”:必填,应用的版本号。

  • “name”:必填,应用名称。

  • “description”:可选,应用简单描述信息。

  • “content”:必填,应用运行的起始页。

  • “permission”:必填,权限配置。

前端开发框架

可与第三方前端框架混用,也可不用我们的框架;

  • api.css 处理不同平台浏览器的默认样式,

  • api.js 提供最基础的 JavaScript 方法,

所有方法在 window.$api 对象下。

详细文档见前端框架开发指南文档https://docs.apicloud.com/Front-end-Framework/framework-dev-guide)

api.js

用法$api.

.trim() 去掉字符串首尾空格;

.trimAll() 去掉字符串所有空格;

.isArray() 判断对象是否为数组;

.addEvt((el, 事件, fn, false) 为DOM元素绑定事件;

.rmEvt() 移除DOM元素绑定的事件;

.one(el, 事件, fn, false) 为DOM元素绑定事件,事件只执行一次;

.dom(el, CSS 选择器) 返回首个匹配的DOM元素;

.domAll(el, CSS 选择器) 选择所有匹配的DOM元素;

.byId() 通过Id选择DOM元素;

.first(el, selector) 选择DOM元素的第一个子元素;

.last() 选择DOM元素的最后一个子元素;

.eq( el, index) 选择第几个子元素;

.prev( el) 选择相邻的前一个元素;

.next( el) 选择相邻的下一个元素;

.contains(parentEl, targetEl) 判断某一个元素是否包含目标元素;

.closest()

.remove() 移除DOM元素;

.attr(el, name, value) 获取或设置DOM元素的属性;

.removeAttr(el, name) 移除DOM元素的属性;

.hasCls(el, cls) DOM元素是否含有某个className;

.addCls(el, cls) 为DOM元素增加className;

.removeCls(el, cls) 移除指定的className;

.val(el, val) 获取或设置常用 Form 表单元素的 value 值;

.prepend(el, html) 在DOM元素内部,首个子元素前插入HTML字符串$api.prepend(el,'

  • hello
  • ');

    .append(el, html) 在DOM元素内部,最后一个子元素后面插入HTML字符串

    .before(el, html) 在DOM元素前面插入HTML字符串;

    .after(el, html) 在DOM元素后面插入HTML字符串;$api.after(el,'

    world

    ');

    .html(el, html) 获取或设置DOM元素的innerHTML;

    .text(el, txt) 设置或者获取元素的文本内容;

    .offset() 获取元素在页面中的位置与宽高,(此为距离页面左侧及顶端的位置,并非距离窗口的位置);

    var offset = $api.offset(el);
    var left = offset.l;
    var top = offset.t;
    var width = offset.w;
    var height = offset.h;

    .css(el,'width:800px;border:1px solid red') 设置所传入的DOM元素的样式,可传入多条样式;

    .cssVal() 获取指定DOM元素的指定属性的完整的值,$api.cssVal(el,'width'); // 800px;

    .jsonToStr() 将标准的JSON 对象转换成字符串格式;

    . strToJson () 将JSON字符串转换成JSON对象;

    .setStorage(key,value) 设置localStorage数据;

    .getStorage(key) 获取localStorage数据,必须与$api.setStorage()配套使用;

    .rmStorage(key) 清除localStorage中与键名对应的值;

    .clearStorage () 清除localStorage的所有数据,慎用;

    .fixIos7Bar(el) 适配iOS7+系统状态栏,为传入的DOM元素增加20px的上内边距;

    .fixStatusBar() 避免header与状态栏重叠;

    .toast('演示','延时提示框',1000) 延时提示框;

    .get(url,function(ret){ alert(ret);},json) api.ajax() 方法的get方式;

    .post(url,data,fnSuc,dataType) api.ajax()方法的post方式;

    前端API调用

    1. 核心模块在 window.api 对象下,默认提供该模块,不需要单独引用。

    2. 扩展模块在相应的模块对象下(例如:文件系统模块在fs对象下),需要require引入(var fs = api.require('fs');)。API核心模块已经覆盖一般应用的绝大部分功能。

    3. 模块中所有方法均遵循 api.functionName(params, callback)格式,params为JSON格式,callback是Function类型,callback返回两个参数,均为JSON格式:callback(ret, err),ret处理成功信息,err处理错误信息。

    4. apiready 方法在所有核心API模块准备完毕时执行。(api文档 https://docs.apicloud.com/Client-API/api)

    var systemType = api.systemType; // 比如: ios 系统类型

    var deviceModel = api.deviceModel; // 比如: iPhone 5 设备名称

    var screenWidth = api.screenWidth; // 比如: 640 屏幕分辨率

    header.style.paddingTop = api.safeArea.top + 'px'; 沉浸式
    var statusBarAppearance = api.statusBarAppearance; // 比如: true 当前应用状态栏是否支持沉浸式效果,布尔类型。

    这个笔记为了方便查找方便,如果在用的小伙伴可以放到桌面便于查找;对前端感兴趣的小白可以加企鹅群:829568767,免费公开课 。

    你可能感兴趣的:(自己总结的APICloud便于查找小文档)