美文网首页
ios---JavaScript与iOS原生交互

ios---JavaScript与iOS原生交互

作者: lizhi_boy | 来源:发表于2017-05-15 14:11 被阅读16次

    第一种:UIWebView与js交互

    1、初始化
        self.webView2 = [[UIWebView alloc] initWithFrame:self.view.frame];
        _webView2.delegate = self;
            NSURLRequest *url = [NSURLRequest requestWithURL:[NSURL URLWithString:@"http://112.124.54.19/Score/cet.html"]];
        [self.webView2 loadRequest:url];
        [self.view addSubview:self.webView2];
        self.whiteView.hidden = NO;//一个白色的View主要是遮盖未修改的html界面
    
    
    2、实现代理方法
    -(void)webViewDidFinishLoad:(UIWebView *)webView{
        //删除图片
        NSString * p = @"var  p = document.getElementsByClassName('pic');";
        NSString * r = @"p[0].remove();";
        NSString * java = [NSString stringWithFormat:@"%@%@",p,r];
        //替换文字
        NSString * text_p = @"var  p = document.getElementsByClassName('tips-hold');";
        NSString * text_r = @"p[0].innerHTML='XXX四六级英语查询';";
        NSString * text_java = [NSString stringWithFormat:@"%@%@",text_p,text_r];
        //修改按钮颜色
        NSString * btn_p = @"var p = document.getElementById('submit-btn');";
        NSString * btn_r = @"p.style.backgroundColor='#4CA4FE';";
        NSString * btn_java = [NSString stringWithFormat:@"%@%@",btn_p,btn_r];
        JSContext *context = [webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];
        [context evaluateScript:java];
        [context evaluateScript:text_java];
        [context evaluateScript:btn_java];
        self.whiteView.hidden = YES;
    }
    

    第二种:WKWebView与js交互

    1、初始化
        WKWebView *webView = [[WKWebView alloc] initWithFrame:self.view.frame];
        webView.allowsBackForwardNavigationGestures = YES;
        NSURLRequest *url = [NSURLRequest requestWithURL:[NSURL URLWithString:@"http://112.124.54.19/Score/cet.html"]];
        [webView loadRequest:url];
        webView.navigationDelegate = self;
        [self.view addSubview:webView];
        self.webView = webView;
    
    2、实现代理方法
    
    -(void)webView:(WKWebView *)webView didFinishNavigation:(WKNavigation *)navigation{
        
        //删除图片
        NSString * p = @"var  p = document.getElementsByClassName('pic');";
        NSString * r = @"p[0].remove();";
        NSString * java = [NSString stringWithFormat:@"%@%@",p,r];
        
        //替换文字
        NSString * text_p = @"var  p = document.getElementsByClassName('tips-hold');";
        NSString * text_r = @"p[0].innerHTML='XXX四六级英语查询';";
        NSString * text_java = [NSString stringWithFormat:@"%@%@",text_p,text_r];
        
        //修改按钮颜色
        NSString * btn_p = @"var p = document.getElementById('submit-btn');";
        NSString * btn_r = @"p.style.backgroundColor='#4CA4FE';";
        NSString * btn_java = [NSString stringWithFormat:@"%@%@",btn_p,btn_r];
       
        [webView evaluateJavaScript:java completionHandler:nil];
        [webView evaluateJavaScript:text_java completionHandler:nil];
        [webView evaluateJavaScript:btn_java completionHandler:nil];
        self.whiteView.hidden = YES;
    }
    
    

    另外补充:显示加载进度条

    
    -(UIProgressView *)progressView{
        if (!_progressView) {
            _progressView = [[UIProgressView alloc] initWithFrame:CGRectMake(0, 64, self.view.frame.size.width, 2)];
            _progressView.progressTintColor = [UIColor redColor];
            [self.view addSubview:_progressView];
        }
        return _progressView;
    }
    
    
    1、监听属性
     //添加监听
        [self.webView addObserver:self forKeyPath:@"estimatedProgress" options:NSKeyValueObservingOptionNew context:nil];
    
    2、监听属性变化执行
    -(void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary<NSKeyValueChangeKey,id> *)change context:(void *)context{
        if ([keyPath isEqualToString:@"estimatedProgress"]) {
            self.progressView.progress = self.webView.estimatedProgress;
            //加载完成
            if (self.webView.estimatedProgress >=1.0) {
                [UIView animateWithDuration:0.25 animations:^{
                    self.progressView.alpha = 0.0f;
                    self.progressView.progress = 0.0f;
                }];
            }else{
                self.progressView.alpha = 1.0f;
            }
        }
    }
    

    查看效果:
    修改前:


    Paste_Image.png

    修改后:

    Paste_Image.png

    适用方向:
    可以除掉一些html界面的广告,或者自定义html中的的某些视图,在下修为尚浅,文章仅限学习或参考,若有帮助到您,前点击喜欢或收藏,谢谢!

    相关文章

      网友评论

          本文标题:ios---JavaScript与iOS原生交互

          本文链接:https://www.haomeiwen.com/subject/tjkhxxtx.html