zoukankan      html  css  js  c++  java
  • iOS:WKWebView(19-05-30更)

    以前用得不多,先开一篇,以后有遇到再补充。

    1、返回 

    2、JS 调用 OC

    3、获取、修改、添加、删除网页信息

    1、返回

    if (self.mWebView.canGoBack == YES) {
        [self.mWebView goBack];
    }else{
        //提示
    };

    2、JS 调用 OC

      2-1)、添加 和 JS 约定的消息名

    [self.userContentController addScriptMessageHandler:self  name:@"约定的消息名"];
    

      2-2)、得到 JS 消息

    #pragma mark - WKScriptMessageHandler
    - (void)userContentController:(WKUserContentController *)userContentController didReceiveScriptMessage:(WKScriptMessage *)message
    {
        if ([message.name isEqualToString:@"约定的消息名"]) {
            NSLog(@"传过来的value为:%@", message.body[@"约定的key"]);
        }
    }
    

      2-3)、移除

    - (void)viewWillDisappear:(BOOL)animated{
        [super viewWillDisappear:animated];
        
        [self.userContentController removeScriptMessageHandlerForName:@"约定的消息名"];
    }
    

    补充:这步最为重要,如果不移除,将得不到释放,比如H5的音乐在退出该VC(dealloc) 还会一直响。

    附:JS代码

    function isAndroid(argument) {
        var u = navigator.userAgent;
        var flag = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
        return flag;
    }
    
    function isIOS(argument) {
        var u = navigator.userAgent;
        var flag = !!u.match(/(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
        return flag;
    }
                             
    function share(要传的value) {
        if(isAndroid()){
    
        } else if(isIOS()) {
            window.webkit.messageHandlers.约定的消息名.postMessage({
                                                            "约定的key": 要传的value
                                                            });
        }
    }
    

    3、获取、修改、添加、删除网页信息

      3-1)、获取

        3-1-1)、获取网页数据

    [webView evaluateJavaScript:@"document.body.outerHTML" completionHandler:^(id _Nullable htmlStr, NSError * _Nullable error) {
        NSLog(@"htmlStr = %@",htmlStr);
    }];
    

         3-1-2)、获取网页高度,看需更新高度(如高度固定,网页内部能滑动,如更改高度为当前高度,网页不能滑动)

    [webView evaluateJavaScript:@"document.body.scrollHeight" completionHandler:^(id result, NSError *_Nullable error) {
    }];
    

      补充:如计算出来的高度偏大、字体、图片偏小,可能是没自适应,需要对其修改。

          参照 “3、获取、修改、添加网页信息” -> “3-3)、添加” -> “3-3-1)、自适应图片” 和 “3-3-2)、自适应文字”

      3-2)、修改

        3-2-1)、修改背景、文字颜色

    [webView evaluateJavaScript:@"document.body.style.backgroundColor="#72ADFC "" completionHandler:nil];
    [webView evaluateJavaScript:@"document.body.style.webkitTextFillColor= '#FFFFFF'"completionHandler:nil];

        3-2-2)、修改网页内容(比如:图片)

    [webView evaluateJavaScript:@"document.getElementsByClassName('图片xxx')[0].src='http://www.测试测试.com/测试测试.jpg'" completionHandler:^(id _Nullable htmlStr, NSError * _Nullable error) {
        // 延时再显示(否则之前的图片会显示出来,再刷新当前设置的图片,一闪而过)
        dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(0.5 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
            // 显示
            self.mainWebView.hidden = NO;
        });
    }];

      3-3)、添加

        3-3-1)、自适应图片。比如 @"document.body.scrollHeight" 算出来感觉偏大,图片偏小。需要在在html字符串增加数据

    flexHtmlString = [NSString stringWithFormat:@"<html><head><meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport"><style type="text/css">img{display: inline-block;max- 100%%}</style></head><body>\%@</body></html>",htmlString];

        3-3-2)、自适应文字。比如 @"document.body.scrollHeight" 算出来感觉偏大,文字偏小。需要设置WKUserScript

    NSString *jScript = @"var meta = document.createElement('meta'); meta.setAttribute('name', 'viewport'); meta.setAttribute('content', 'width=device-width'); document.getElementsByTagName('head')[0].appendChild(meta);";
    
    WKUserScript *wkUScript = [[WKUserScript alloc] initWithSource:jScript
                                                     injectionTime:WKUserScriptInjectionTimeAtDocumentEnd
                                                  forMainFrameOnly:YES];
    WKUserContentController *wkUController = [[WKUserContentController alloc] init];
    [wkUController addUserScript:wkUScript];
    

         3-3-3)、添加高度参数,源数据没style。

    [webView evaluateJavaScript:@"document.getElementsByClassName('图片xxx')[0].style=' 70px;height:auto !important;'" completionHandler:^(id _Nullable htmlStr, NSError * _Nullable error) {
    }];
    

      3-4)、删除

        3-4-1)、删除子项

    [webView evaluateJavaScript:@"document.body.removeChild(document.getElementsByClassName('xxx')[0])" completionHandler:^(id _Nullable htmlStr, NSError * _Nullable error) {
        }];
    

         3-4-2)、删除子项中的子项

    [webView evaluateJavaScript:@"document.body.getElementsByClassName('xxx1')[0].removeChild(document.getElementsByClassName('xxx1')[0].getElementsByClassName('xxx2')[0])" completionHandler:^(id _Nullable htmlStr, NSError * _Nullable error) {
    
    }];
    
  • 相关阅读:
    最小生成树
    负环详解
    P2053 [SCOI2007]修车
    P3254 圆桌问题
    P3114 [USACO15JAN]踩踏Stampede
    SP1043 GSS1
    SP2713 GSS4
    导出mysql内数据 python建倒排索引
    社团管理系统——总结报告
    北京地铁出行线路规划——代码实现
  • 原文地址:https://www.cnblogs.com/leonlincq/p/10322030.html
Copyright © 2011-2022 走看看