kerkee 之Web和iOS开发使用篇

最新推荐文章于 2023-10-19 08:00:00 发布
最新推荐文章于 2023-10-19 08:00:00 发布
阅读量2.8k 收藏
点赞数 1
分类专栏： 你好！iOS 文章标签： iOS kerkee Hybrid JS
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/u012390519/article/details/51702233
版权

简单认识：kerkee 是一个多主体共存型 Hybrid 框架，具有跨平台、用户体验好、性能高、扩展性好、灵活性强、易维护、规范化、集成云服务、具有Debug环境、彻底解决跨域问题。该框架从开发者角度支持三种团队开发模式：Web开发者 、Native开发者 、Web开发者和Native团队共同合作的开发团队 。

下面我将从 Web开发者和Native（iOS）团队共同合作的开发团队 模式来分析使用该框架。

一、相关资料：

官网地址：http://www.kerkee.com

Github 源码地址：https://github.com/kercer

QQ交流群：110710084

二、简单的使用：

kerkee在iOS上的快速上手指南

1、建立新项目 kerkeeHDDemo 在项目目录中建立 Podfile 文件：

platform :ios, '7.0'

inhibit_all_warnings!
pod ‘kerkee’, ’~> 1.0.1’

2、使用 CocoaPods 来导入 kerkee 框架，使用终端 cd 到你的 Podfile 文件所在的目录:

cd $PodfilePath
pod install

3、运行 Podfile 同目录中的 kerkeeHDDemo.xcworkspace 即可；

4、在项目中添加 html 代码：(本人对 html 不熟悉，相信懂的人肯定懂)

kerkeeTest.html :

<!--Create by Harry on 17/06/2016-->
<!--  Copyright © 2016年 HarryDeng. All rights reserved.-->

<html>
    <head>
        <title>kerkee测试h5界面</title>
        <meta http-equiv="Content-Type"content="text/html; charset=UTF-8">
            <script>
                function test()
                {
                    alert("test alert...");
                    return "abcd";
                }
                </script>
            </head>

    <body>
        <br/>
        <br/>

        <input type="button" value="js数据传递给oc" onclick="kerkeeJSManager.jsToOc('js数据传递给oc'); ">

        <br/>

        <input type="button" value="js数据传递给oc，oc回传给js" onclick="kerkeeJSManager.mutualJSOC('js数据传递给oc，oc回传给js', function(json)
                {
                console.log(JSON.stringify(json))
                }); ">

        <br/>

        <button id="hallo" onclick="buttonClick1('js数据传递给oc,h5的方法单独写出buttonClick1')">
            js数据传递给oc,h5的方法单独写出buttonClick1 </button>

        <br/>

        <button id="hallo" onclick="buttonClick2('js数据传递给oc,h5的方法单独写出buttonClick2')">
            js数据传递给oc,h5的方法在js文件实现 buttonClick2 </button>

        <br/>

    </body>

            <script>
            var kerkeeJSManager;
            function buttonClick1(s1)
            {
                kerkeeJSManager.jsToOc(s1);
            }

            function ocToJs(s1)
            {
                console.log(JSON.stringify(s1))
            }
            </script>

            <!--html页面绑定js事件，一般放在href之后，如果放在之前加载JS事件会阻塞界面-->
            <script type="text/javascript" src="kerkeeTest.js"></script>

</html>

上面有三种方式来处理按钮的点击事件：

i. 直接在 中处理

ii. 使用 function 处理；

iii. 使用 js 来处理 function。

代码解释：

代码理解分析
kerkeeJSManagerjs 这边中 iOS 和 js 交互桥梁，在 iOS 也同样存在 kerkeeJSManager 关键字
jsToOc()kerkeeJSManager 方法 ，使用 kerkeeJSManager.jsToOc() 可以调用 iOS 对应的 - (void)jsToOc:(KCWebView)aWebView argList:(KCArgList)args 方法，实现 js 调用 iOS原生代码
ocToJs()在 iOS 中使用 [KCJSBridge callJSFunction:@"ocToJs" withJSONObject:@{@"hhh" : @"www"} WebView:m_webView]; 可以调用 js 的 ocToJs() 方法，实现了 iOS 调用 js 代码
  

kerkeeTest.js :

var kerkeeJSManager;
function buttonClick2(s1)
{
    kerkeeJSManager.jsToOc(s1);
}

5、在项目中添加 iOS 代码:

HDJSToOCManager.h：

#import <Foundation/Foundation.h>
#import "KCJSObject.h"
#import "KCArgList.h"

// 这个类作为 和 js 交互桥梁类
@interface HDJSToOCManager : KCJSObject

- (void)jsToOc:(KCWebView*)aWebView argList:(KCArgList*)args;

- (void)mutualJSOC:(KCWebView*)aWebView argList:(KCArgList*)args;

@end

HDJSToOCManager.m：

#import "HDJSToOCManager.h"

#import <UIKit/UIKit.h>
#import "KCJSBridge.h"

@implementation HDJSToOCManager

- (NSString*)getJSObjectName{
    // 这个 和 js 中的变量要保持一致
    return @"kerkeeJSManager";
}
// js 中 可以调用 jsToOc() 来调用
- (void)jsToOc:(KCWebView*)aWebView argList:(KCArgList*)args{
    NSLog(@"JS调用OC args : %@", args);
}

- (void)mutualJSOC:(KCWebView*)aWebView argList:(KCArgList*)args{
    NSLog(@"JS调用OC，OC回调JS args : %@", args);

    NSMutableDictionary *dic = [NSMutableDictionary dictionary];
    [dic setObject:@"success" forKey:@"info"];
    NSString *json = [[NSString alloc] initWithData:[NSJSONSerialization dataWithJSONObject:dic options:0 error:nil] encoding:NSUTF8StringEncoding];
    KCAutorelease(json);
    //回调，callbackId，kerkee.js 内部已经处理好
    [KCJSBridge callbackJS:aWebView callBackID:[args getObject:@"callbackId"] jsonString:json];
}

@end

这个类主要是生成和 js 对应的变量 kerkeeJSManager ，是 iOS 这边 iOS 和 js 交互桥梁

ViewController.m：

- (void)viewDidLoad {
    [super viewDidLoad];

     // 将 HDJSToOCManager对象 和 js中的 kerkeeJSManager (详见HDJSToOCManager)绑定
    [KCJSBridge registObject:[[HDJSToOCManager alloc] init]];

    NSString *file = [[NSBundle mainBundle] pathForResource:@"kerkeeTest" ofType:@"html"];
    NSURL *url = [NSURL URLWithString:file];
    NSMutableURLRequest *request =[NSMutableURLRequest requestWithURL:url];
    m_webView = [[KCWebView alloc] initWithFrame:self.view.bounds];
    [m_webView loadRequest:request];
    [self.view addSubview:m_webView];

    // 在m_webView 加载 “kerkee.js” 代码，具体代码见 KCApiBridge.m 中的 init 方法 （这个时候需要在项目中添加“kerkee.js” 文件）
    m_jsBridge = [[KCJSBridge alloc] initWithWebView:m_webView delegate:self];

    UIButton *bb = [UIButton buttonWithType:UIButtonTypeInfoLight];
    bb.frame = CGRectMake(100, 400, 50, 50);
    [bb addTarget:self action:@selector(ocToJs) forControlEvents:UIControlEventTouchUpInside];
    [self.view addSubview:bb];
}

- (void)ocToJs{
    [KCJSBridge callJSFunction:@"ocToJs" withJSONObject:@{@"hhh" : @"www"} WebView:m_webView];
}

#pragma mark --
#pragma mark KCWebViewProgressDelegate
-(void)webView:(KCWebView*)webView identifierForInitialRequest:(NSURLRequest*)initialRequest{

}

#pragma mark - UIWebView Delegate
- (void)webViewDidFinishLoad:(UIWebView *)aWebView{
    NSString *scrollHeight = [aWebView stringByEvaluatingJavaScriptFromString:@"document.body.scrollHeight;"];
    NSLog(@"scrollHeight: %@", scrollHeight);
    NSLog(@"webview.contentSize.height %f", aWebView.scrollView.contentSize.height);
}

- (void)webView:(UIWebView *)webView didFailLoadWithError:(NSError *)error{

}

- (BOOL)webView:(UIWebView *)aWebView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType{
    return YES;
}

上面的代码并不多，其核心代码之一在 KCApiBridge 中，可以看到， KCApiBridge 在初始化的时候找到 kerkee.js 并且使用- (nullable NSString *)stringByEvaluatingJavaScriptFromString:(NSString *)script; 在 iOS 的 UIWebView 注入 kerkee.js 代码。这份 js 才是真正的将 iOS 的桥梁 HDJSToOCManager 实体和 js变量 kerkeeJSManager 的关键代码。在 这里 可以看到作者在demo中的 kerkee.js 源码。因为我对 js 也是入门阶段，所以选择在源码上改动之后，代码如下：

;(function(window){
    if (window.WebViewJSBridge)
        return;
    window.WebViewJSBridge = {

  };

    console.log("--- kerkee init begin---");
    var browser={
        versions:function(){
            var u = navigator.userAgent, app = navigator.appVersion;
            return {
                trident: u.indexOf('Trident') > -1, //IE
                presto: u.indexOf('Presto') > -1, //opera
                webKit: u.indexOf('AppleWebKit') > -1, //apple&google kernel
                gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1,//firfox
                mobile: !!u.match(/AppleWebKit.*Mobile.*/), //is Mobile
                ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //is ios
                android: u.indexOf('Android') > -1 || u.indexOf('Adr') > -1, //android
                iPhone: u.indexOf('iPhone') > -1 , //iPhone or QQHD
                iPad: u.indexOf('iPad') > -1, //iPad
                iPod: u.indexOf('iPod') > -1, //iPod
                webApp: u.indexOf('Safari') == -1, //is webapp,no header and footer
                weixin: u.indexOf('MicroMessenger') > -1, //is wechat
                qq: u.match(/\sQQ/i) == " qq" //is qq
            };
        }(),
        language:(navigator.browserLanguage || navigator.language).toLowerCase()
    }

    var global = this || window;

    var ApiBridge ={
        msgQueue : [],
        callbackCache : [],
        callbackId : 0,
        processingMsg : false,
        isReady : false,
        isNotifyReady : false
    };

    ApiBridge.create = function()
    {                  
        ApiBridge.bridgeIframe = document.createElement("iframe");
        ApiBridge.bridgeIframe.style.display = 'none';
        document.documentElement.appendChild(ApiBridge.bridgeIframe);
    };

    ApiBridge.prepareProcessingMessages = function()
    {
        ApiBridge.processingMsg = true;
    };

    ApiBridge.fetchMessages = function()
    {
        if (ApiBridge.msgQueue.length > 0)
        {
            var messages = JSON.stringify(ApiBridge.msgQueue);
            ApiBridge.msgQueue.length = 0;
            return messages;
        }
        ApiBridge.processingMsg = false;
        return null;
    };

    ApiBridge.callNative = function(clz, method, args, callback)
    {
        var msgJson = {};
        msgJson.clz = clz;
        msgJson.method = method;
        if (args != undefined)
            msgJson.args = args;

        if (callback)
        {
            var callbackId = ApiBridge.getCallbackId();
            ApiBridge.callbackCache[callbackId] = callback;
            if (msgJson.args)
            {
                msgJson.args.callbackId = callbackId.toString();
            }
            else
            {
                msgJson.args =
                {
                    "callbackId" : callbackId.toString()
                };
            }
        }

        if (browser.versions.ios)
        {
            if (ApiBridge.bridgeIframe == undefined)
            {
                ApiBridge.create();
            }
            // var msgJson = {"clz": clz, "method": method, "args": args};
            ApiBridge.msgQueue.push(msgJson);
            if (!ApiBridge.processingMsg)
                ApiBridge.bridgeIframe.src = "kcnative://go";
        }
        else if (browser.versions.android)
        {
            // android
            return prompt(JSON.stringify(msgJson));
        }

    };

    ApiBridge.log = function(msg)
    {
        ApiBridge.callNative("ApiBridge", "JSLog",
        {
            "msg" : msg
        });
    }

    ApiBridge.getCallbackId = function()
    {
        return ApiBridge.callbackId++;
    }

    ApiBridge.onCallback = function(callbackId, obj)
    {
        if (ApiBridge.callbackCache[callbackId])
        {
            ApiBridge.callbackCache[callbackId](obj);
            // ApiBridge.callbackCache[callbackId] = undefined;
            // //如果是注册事件的话，不能undefined；
        }
    }

    ApiBridge.onBridgeInitComplete = function(callback)
    {
        ApiBridge.callNative("ApiBridge", "onBridgeInitComplete", {}, callback);
    }

    ApiBridge.onNativeInitComplete = function(callback)
    {
        ApiBridge.isReady = true;
        console.log("--- kerkee onNativeInitComplete end ---");

        if (callback)
        {
            callback();
            ApiBridge.isNotifyReady = true;
            console.log("--- device ready go--- ");
        }
    }

    ApiBridge.compile = function(aIdentity, aJS)
    {
        var value;
        var error;
        try
        {
            value = eval(aJS);
        }
        catch (e)
        {
            var err = {};
            err.name = e.name;
            err.message = e.message;
            err.number = e.number & 0xFFFF;
            error = err;
        }

        ApiBridge.callNative("ApiBridge", "compile",
        {
            "identity" : aIdentity,
            "returnValue" : value,
            "error" : error
        });
    }

    var _Configs =
    {
        isOpenJSLog:false,
        sysLog:{},
        isOpenNativeXHR:true,
        sysXHR:{}
    };
    _Configs.sysLog = global.console.log;
    _Configs.sysXHR = global.XMLHttpRequest;


    var kerkee = {};


    /*****************************************
     * JS和iOS 交互接口
     *****************************************/
    kerkee.jsToOc = function(s1)
       {
       ApiBridge.callNative("kerkeeJSManager", "jsToOc",
            {
                "s1" : s1
            });
       };

       kerkee.mutualJSOC = function(aString, callback)
       {
       ApiBridge.callNative("kerkeeJSManager", "mutualJSOC",
            {
                "aString" : aString
            }, callback);
       }

    global.kerkeeJSManager = kerkee;


    kerkee.openJSLog = function()
    {
        _Configs.isOpenJSLog = true;
        global.console.log = ApiBridge.log;
    }
    kerkee.closeJSLog = function()
    {
        _Configs.isOpenJSLog = false;
        global.console.log = _Configs.sysLog;
    }

    kerkee.onDeviceReady = function(handler)
    {
        ApiBridge.onDeviceReady = handler;

        if (ApiBridge.isReady && !ApiBridge.isNotifyReady && handler)
        {
            console.log("-- device ready --");
            handler();
            ApiBridge.isNotifyReady = true;
        }
    };

    kerkee.invoke = function(clz, method, args, callback)
    {
        if (callback)
        {
            ApiBridge.callNative(clz, method, args, callback);
        }
        else
        {
            ApiBridge.callNative(clz, method, args);
        }
    };

    kerkee.onSetImage = function(srcSuffix, desUri)
    {
        // console.log("--- kerkee onSetImage ---");
        var obj = document.querySelectorAll('img[src$="' + srcSuffix + '"]');
        for (var i = 0; i < obj.length; ++i)
        {
            obj[i].src = desUri;
        }
    };


    /*****************************************
     * XMLHttpRequest实现
     *****************************************/
    var _XMLHttpRequest = function()
    {
        this.id = _XMLHttpRequest.globalId++;
        _XMLHttpRequest.cache[this.id] = this;

        this.status = 0;
        this.statusText = '';
        this.readyState = 0;
        this.responseText = '';
        this.headers = {};
        this.onreadystatechange = undefined;

        ApiBridge.callNative('XMLHttpRequest', 'create',
        {
            "id" : this.id
        });
    }

    _XMLHttpRequest.globalId = 0;
    _XMLHttpRequest.cache = [];
    _XMLHttpRequest.setProperties = function(jsonObj)
    {
        var id = jsonObj.id;
        if (_XMLHttpRequest.cache[id])
        {
            var obj = _XMLHttpRequest.cache[id];

            if (jsonObj.hasOwnProperty('status'))
            {
                obj.status = jsonObj.status;
            }
            if (jsonObj.hasOwnProperty('statusText'))
            {
                obj.statusText = jsonObj.statusText;
            }
            if (jsonObj.hasOwnProperty('readyState'))
            {
                obj.readyState = jsonObj.readyState;
            }
            if (jsonObj.hasOwnProperty('responseText'))
            {
                obj.responseText = jsonObj.responseText;
            }
            if (jsonObj.hasOwnProperty('headers'))
            {
                obj.headers = jsonObj.headers;
            }

            if (_XMLHttpRequest.cache[id].onreadystatechange)
            {
                _XMLHttpRequest.cache[id].onreadystatechange();
            }
        }
    }

    _XMLHttpRequest.prototype.open = function(method, url, async)
    {
        ApiBridge.callNative('XMLHttpRequest', 'open',
        {
            "id" : this.id,
            "method" : method,
            "url" : url,
            "scheme" : window.location.protocol,
            "host" : window.location.hostname,
            "port" : window.location.port,
            "href" : window.location.href,
            "referer" : document.referrer != "" ? document.referrer : undefined,
            "useragent" : navigator.userAgent,
            "cookie" : document.cookie != "" ? document.cookie : undefined,
            "async" : async,
            "timeout" : this.timeout
        });
    }

    _XMLHttpRequest.prototype.send = function(data)
    {
        if (data != null)
        {
            ApiBridge.callNative('XMLHttpRequest', 'send',
            {
                "id" : this.id,
                "data" : data
            });
        }
        else
        {
            ApiBridge.callNative('XMLHttpRequest', 'send',
            {
                "id" : this.id
            });
        }
    }
    _XMLHttpRequest.prototype.overrideMimeType = function(mimetype)
    {
        ApiBridge.callNative('XMLHttpRequest', 'overrideMimeType',
        {
            "id" : this.id,
            "mimetype" : mimetype
        });
    }
    _XMLHttpRequest.prototype.abort = function()
    {
        ApiBridge.callNative('XMLHttpRequest', 'abort',
        {
            "id" : this.id
        });
    }
    _XMLHttpRequest.prototype.setRequestHeader = function(headerName,
            headerValue)
    {
        ApiBridge.callNative('XMLHttpRequest', 'setRequestHeader',
        {
            "id" : this.id,
            "headerName" : headerName,
            "headerValue" : headerValue
        });
    }
    _XMLHttpRequest.prototype.getAllResponseHeaders = function()
    {
        var strHeaders = '';
        for ( var name in this.headers)
        {
            strHeaders += (name + ": " + this.headers[name] + "\r\n");
        }
        return strHeaders;
    }
    _XMLHttpRequest.prototype.getResponseHeader = function(headerName)
    {
        var strHeaders;
        var upperCaseHeaderName = headerName.toUpperCase();
        for ( var name in this.headers)
        {
            if (upperCaseHeaderName == name.toUpperCase())
                strHeaders = this.headers[name]
        }
        return strHeaders;
    }
    _XMLHttpRequest.deleteObject = function(id)
    {
        if (_XMLHttpRequest.cache[id])
        {
            _XMLHttpRequest.cache[id] = undefined;
        }
    }

    global.ApiBridge = ApiBridge;
    global.kerkee = kerkee;
    global.XMLHttpRequest = _XMLHttpRequest;

    kerkee.register = function(_window)
    {
        _window.ApiBridge = window.ApiBridge;
        _window.kerkee = window.kerkee;
        _window.console.log = window.console.log;
        _window.XMLHttpRequest = window.XMLHttpRequest;
        _window.open = window.open;
    };


    ApiBridge.onBridgeInitComplete(function(aConfigs)
    {
        if (aConfigs)
        {
            if (aConfigs.hasOwnProperty('isOpenJSLog'))
            {
                _Configs.isOpenJSLog = aConfigs.isOpenJSLog;
            }
            if (aConfigs.hasOwnProperty('isOpenNativeXHR'))
            {
                _Configs.isOpenNativeXHR = aConfigs.isOpenNativeXHR;
            }
        }

        if (_Configs.isOpenJSLog)
        {
            global.console.log = ApiBridge.log;
        }
        ApiBridge.onNativeInitComplete(ApiBridge.onDeviceReady);

    });

})(window);

如果单纯的只是 js 和 iOS 的交互，只需要关注 下面 的代码即可：（当然你也可以自己设置多个 kerkeeJSManager 桥梁及 更多的 交互方法）

/*****************************************
 * JS和iOS 交互接口
 *****************************************/
kerkee.jsToOc = function(s1)
   {
   ApiBridge.callNative("kerkeeJSManager", "jsToOc",
        {
            "s1" : s1
        });
   };

   kerkee.mutualJSOC = function(aString, callback)
   {
   ApiBridge.callNative("kerkeeJSManager", "mutualJSOC",
        {
            "aString" : aString
        }, callback);
   }

global.kerkeeJSManager = kerkee;

6、编译运行：

Xcode 编译运行效果

7、demo下载地址：GitHub地址

三、总结：

这里只是简单的介绍了 iOS 使用 kerkee 框架来加载 html 实现 js 和 iOS 交互 ，如果只是单纯的为了简单的交互，可以看我的另外一篇博客 ：JS和OC相互调用 ，这里介绍了几个更加轻量级的框架实现 js 和 iOS 交互。但是 js 和 iOS 交互 功能在kerkee 框架的一小部分，更多高性能、支持跨平台、扩展性好、易维护等等优秀的特性，我会慢慢阅读源码来说明。

兵临城下也
关注
专栏目录
如何开发混合式app？
蓝海汇
12-20 3547
HybridApp（混合模式移动应用）是指介于web-app、native-app这两者之间的app，兼具“Native App良好用户交互体验的优势”和“Web App跨平台开发的优势”。 汽车有混合动力Hybrid，移动应用同样也有混合模式。Hybrid App（混合模式移动应用）兼具“Native App良好用户交互体验的优势”和“Web App跨平台开发的优势”。很多人不知道市场上一些主流...
APP开发技术浅析
Eve的博客
04-24 2827
注：此处App为应用，application，并非我们通常讲的手机App。一、纵向对比Native App传统的原生App开发模式，有iOS和Android两大系统，需要各自语言开发各自App。优点：性能和体验都是最好的 缺点：开发和发布成本高 应用技术：Swift，OC，JavaWebApp移动端的网站，常被称为H5应用，说白了就是特定运行在移动端浏览器上的网站应用。一般泛指 SPA(Singl...
kerkee_ios, kerkee是一个混合应用框架，这个仓库是 kerkee.zip
09-18
kerkee_ios, kerkee是一个混合应用框架，这个仓库是 kerkee 姓名 kerkee 官网： http://www.kerkee.com： https://github.com/kercerQQ交流群： 110710084
手机客户端和web端开发的异同
weixin_30299709的博客
09-15 290
版本升级。用户角度上看，客户端升级必须让用户手动下载整个新的安装包覆盖安装，而web的升级无需用户做任何事情。开发角度上看，如果客户端有个小bug需要紧急修复，需要修复完后打包一个完成的安装包，给一个版本号，发布给用户升级。而web只需要修改后台的某些文件，然后传到自己的服务器，用多快速的迭代开发方式都没问题。web没有版本兼容性问题，客户端这个问题就大了。iOS客户端用编译语言，web用脚本语言...
Web前端开发与iOS终端开发的异同
OTF的专栏
01-03 944
 Web前端开发与iOS终端开发的异同 对比评测 | 作者：如影随形 | 2014-12-24 09:51:03| 阅读 39次 有用 (1) 评论 (0) 收藏 标签：Web开发 iOS web 前端开发 概述：总结比较Web前端开发与iOS终端开发的异同。 语言 前端和终端作为面向用户端的程序，有个共同特点：需要依赖用户机
iOS开发中的Web应用概述
努力，可能成功！放弃，注定失败！
07-30 1594
为了更好的阅读体验，建议阅读原文 插播广告 —— 几十行代码完成资讯类App多种形式内容页HybridPageKit ：一个针对资讯类App高性能、易扩展、组件化的通用内容页实现框架。 想和我一起全面了解新闻类App的开发，点我学习 移动开发领域近年来已经逐渐告别了野蛮生长的时期，进入了相对成熟的时代。而一直以来Native和Web的争论从未停止，通过开发者孜孜不倦的努力，Web的效率和Native的体验也一直在寻求着平衡。本文聚焦iOS开发和Web开发的交叉点，希望能通过简要的介绍，帮助开发者一.
Android代码-kerkee_android
08-06
Hybrid App兼具了Native App的所有优势，也兼具了Web App使用HTML5跨平台开发低成本的优势。以及具有使用Native扩展Web接口以弥补web无法调用平台性API等优势。Hybrid App也是未来客户端技术的发展趋势。HTML5的出现...
史上最全最新前端面试题（不定期更新，有问题欢迎评论区对线）
lb_nizhanban的博客
06-13 2321
一阶段面试题： CSS浮动怎么理解的 浮动的框可以向左或向右移动，直到它的外边缘碰到包含框或另一个浮动框的边框为止。 由于浮动框不在文档的普通流中，也就是脱离文档流，所以文档的普通流中的块框表现得就像浮动框不存在一样。一般使用float来实现浮动，联系=》清除浮动的相关方法。27题 绝对定位相对定位怎么理解 absolute：绝对定位，将对象从文档流中拖离出来，使用left/right/top/bottom等属性相对其最接近的一个并有定位设置的父元素进行绝对定位；如果不存在这样的父对象，则依据根元素
新一代的Hybrid框架kerkee
weixin_33890526的博客
03-08 196
kerkee kerkee框架的诞生背景 Hybrid App兼具了Native App的所有优势，也兼具了Web App使用HTML5跨平台开发低成本的优势。以及具有使用Native扩展Web接口以弥补web无法调用平台性API等优势。Hybrid App也是未来客户端技术的发展趋势。HTML5的出现，市面上已有很多应用（如淘宝、...
ios web浏览器支持
12-20
支持内部打开浏览器，可打开网页、游戏、视屏。简单快捷
【利用html和JS开发iOS应用程序入门】[PDF+源代码] [iPhone/iPad/Mac]
04-15
【iOS虚幻游戏引擎编程入门】[PDF+源代码] [iPhone/iPad/Mac] 书名：Beginning.iOS.Application.Development.with.HTML.and.JavaScript
通过web安装iOS app
volcan1987的专栏
03-05 5458
原文：http://blog.appliedis.com/2012/10/29/wireless-distribution-of-enterprise-ios-apps/ 我在自己的mac上装了nginx，测试时总是无法弹出安装的alert，后来发现原来是文件的权限问题，权限修改后就可以了，大家一定要注意，下面是原文 One of the tasks we are be
使用HTML(Web)开发iOS/iPhone/iPad应用
nnKevi的博客
12-30 1843
许多人想开发自己的iOS App吧？iOS App有几种开发的方法。一种是“正规”的方法，就是Xcode+ObjC。但是这样既得学习ObjC语言，又得搭建Xcode开发环境。都弄完了，把App放到自己的iPhone/iPad上运行，还是一件很难的事呢！不过，Safari浏览器提供了一个功能，就是把网页添加到桌面上，当成一个独立的App运行。有了这个功能，就太好了！我们可以直接用Web语言(HTML+CSS+JS)开发iOS App，非常简单。
基于ionic和kerkee框架开发-----盛世乐居Hybrid App开发指南
学习笔记
08-25 331
ionic 教程 ionic 是一个强大的 HTML5 应用程序开发框架(HTML5 Hybrid Mobile App Framework )。 可以帮助您使用 Web 技术，比如 HTML、CSS 和 Javascript 构建接近原生体验的移动应用程序。ionic 主要关注外观和体验，以及和你的应用程序的 UI 交互，特别适合用于基于 Hybird 模式的 HTML5 移动应用程序开发...
WEBAPP介绍及其iOS Web开发技巧总结
jeff lee的专栏
11-26 579
结合网上相关资料，以及自己项目中的经验，收集汇总了iOS Webapp相关的开发知识，如下。 WebApp是一种新出现的基于WEB形式的类应用程序，运行在高端的移动终端设备上，其应用范围会越来越广。 开发者们都知道在高端智能手机系统中有两种应用程序：一种是基于本地（操作系统）运行的APP；一种是基于高端机的浏览器运行的WebApp，本文将主要讲解后者。 WebApp与Native
IOS WEB APP学习
X_FOCUS的专栏
09-14 1006
WEB APP混合学习 WEB使用HTML5,
iOS web 、原生 js 交互：方法及原理
ws1836300的博客
07-29 1847
参考链接：https://www.jianshu.com/p/fec29596b8e7 四种方法 链接里介绍的很清楚了： 1.拦截url（适用于UIWebView和WKWebView） 2.JavaScriptCore（只适用于UIWebView，iOS7+） 3.WKScriptMessageHandler（只适用于WKWebView，iOS8+） 4.WebViewJavascriptBridge（适用于UIWebView和WKWebView，属于第三方框架） //--------详细介绍--...
杂项-iOS(iPad或iPhone)搭建本地web服务(ish)
最新发布
csdn_yasin的博客
10-19 1097
【代码】杂项-iOS(iPad或iPhone)搭建本地web服务(ish)
ios首次加载web_iOS 网页的几种加载方法
weixin_35384453的博客
12-30 556
1 webView的使用优点:能在当前app中打开网址,适配 iOS7缺点:没有功能,如果需要功能,只能自己实现1.1 webView加载网页NSURL *url = [NSURL URLWithString:@"http://www.baidu.com"];NSURLRequest *request = [NSURLRequest requestWithURL:url];// 设置内边距self...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值