iOS UIWebView与JS(JavaScript)交互-----根据节点隐藏HTML中内容

在移动端(这里指iOS)开发中,我们免不了使用UIWebView与JS交互。

先简单了解一下JS,JavaScript是一种直译式的脚本语言,是一种动态类型、弱类型、基于原型的语言,内置支持类型。广泛用于客户端,主要用来向HTML页面添加交互行为。它可以直接嵌入HTML页面,但写成单独的JS文件有利于结构和行为的分离。JS具有跨平台特性,在绝大多数浏览器的支持下,可以在多种平台下运行(如Windows、Linux、Mac、Andriod、iOS等)。作为直译语言,它的弱点:安全性。
                                          -- 摘自 百度百科

来看看JS的组成:

ECMAScript : 描述该语言的语法和基本对象

DOM:文档对象模型,描述处理网页内容的方法和接口。

       BOM:浏览器对象模型,描述与浏览器进行交互的方法和接口

举例:

下面是一个HTML页面的网址

http://breadtrip.com/mobile/destination/topic/2387718902/

网页打开是这样

使用Google浏览器打开(别的也行哈),可以看到网站的源码,

我现在直接把它嫁接到我的webView上

  CGRect frame = self.view.bounds;
    UIWebView * webView = [[UIWebView alloc] initWithFrame:frame];
    webView.delegate = self;
    self.webView = webView;
    [self.view addSubview:webView];

    dispatch_queue_t queue = dispatch_queue_create("test", DISPATCH_QUEUE_SERIAL);
    dispatch_async(queue, ^{
        NSString * dataString = [NSString stringWithContentsOfURL:[NSURL URLWithString:self.webUrl] encoding:NSUTF8StringEncoding error:nil];

        dataString = [dataString stringByReplacingOccurrencesOfString:@"\"m-app-download\"" withString:@""];

        dataString = [dataString stringByReplacingOccurrencesOfString:@"\"post-comment\"" withString:@""];

        dispatch_async(dispatch_get_main_queue(), ^{
            [self.webView loadHTMLString:dataString baseURL:nil];
        });
    });
    dispatch_release(queue);

    [webView release];

但是在开发中,网页上的信息我们并不是全要,所以,可以在UIWebView的代理方法

- (void)webViewDidFinishLoad:(UIWebView *)webView

中,使用dom语言把不需要的部分隐藏掉,获取dom节点,并对其中内容进行操作,有很多方法,这里不做赘述,根据需求,这里做隐藏操作

- (void)webViewDidFinishLoad:(UIWebView *)webView
{
    [self.webView stringByEvaluatingJavaScriptFromString:@"document.getElementsByClassName(\"m-app-download\")[0].hidden = true;"];

    [self.webView stringByEvaluatingJavaScriptFromString:@"document.getElementsByClassName(\"comments\")[0].hidden = true;"];

    [self.webView stringByEvaluatingJavaScriptFromString:@"document.getElementsByClassName(\"btn btn-single\")[0].hidden = true"];

    [self.webView stringByEvaluatingJavaScriptFromString:@"document.getElementsByClassName(\"note\")[0].hidden = true"];

    NSString * lengthString = [self.webView stringByEvaluatingJavaScriptFromString:@"document.getElementsByClassName(\"btn btn-single\").length"];

    int length = [lengthString intValue];

    for (int i = 0; i<length; i++) {
        [self.webView stringByEvaluatingJavaScriptFromString:[NSString stringWithFormat:@"document.getElementsByClassName(\"btn btn-single\")[%d].hidden = true;",i]];
    }

}

这样,就可以把界面中不需要的部分隐藏掉了

参考博文: http://www.cnblogs.com/beijingxiaoguo

希望对阅读博文的朋友有帮助,如果文中有描述不清晰的地方,欢迎大家留言,如果有写得不对的地方,也请大家指出

Good night!

                                          Alice

时间: 2024-10-10 23:11:43

iOS UIWebView与JS(JavaScript)交互-----根据节点隐藏HTML中内容的相关文章

iOS开发——实用技术OC篇&amp;UIWebView与JS的交互

UIWebView与JS的交互 事情的起因还是因为项目需求驱动.折腾了两天,由于之前没有UIWebView与JS交互的经历,并且觉得这次在功能上有一定的创造性,特此留下一点文字,方便日后回顾. 我要实现这样一个需求:按照本地的CSS文件展示一串网络获取的带HTML格式的只有body部分的文本,需要自己拼写完整的HTML.除此之外,还需要禁用获取的HTML文本中自带的 < img > 标签自动加载,并把下载图片的操作放在native端来处理,并通过JS将图片在Cache中的地址返回给UIWebv

iOS UIWebView和网页的交互(OC中调执行JS)

UIWebView和网页的交互(OC中调执行JS)- (void)viewDidLoad{[super viewDidLoad];// 1.webViewUIWebView *webView = [[UIWebView alloc] init];webView.frame = self.view.bounds;webView.delegate = self;// 伸缩页面至填充整个webViewwebView.scalesPageToFit = YES;// 隐藏scrollViewwebVie

iOS - OC和网页JS的交互

我们知道,在iOS开发过程中,有时候会用webview加载一张网页,网页上有一些按钮或者其他的一些链接,要使这些按钮有实际的作用,1??要么就是网页部分在HTML文件内部自己实现方法,2??要么就是通过OC和网页的交互,在本app内OC实现点击网页的按钮,可以触发自己OC写的方法. 下面我讲两种常用的方法. 第一种是遵守webview的协议,通过实现协议方法截取网络请求,通过这个截取到的网络请求进行解析,然后实现自己的方法. 第二种方法是用了一个叫WebViewJavascriptBridge

重新想象 Windows 8.1 Store Apps (80) - 控件增强: WebView 之基本应用, POST 数据, 与 JavaScript 交互

[源码下载] 作者:webabcd 介绍重新想象 Windows 8.1 Store Apps 之控件增强 WebView 的基本应用 WebView 通过 POST 请求和 HTTP 头加载 url WebView 与 JavaScript 交互 示例1.演示 WebView 的基本应用WebView/Demo.xaml <Page x:Class="Windows81.Controls.WebView.Demo" xmlns="http://schemas.micr

【iOS开发】UIWebView与JavaScript(JS) 回调交互

引用:http://blog.sina.com.cn/s/blog_693de6100102vi3w.html 很多关于object-c(简称:oc,是ios开发app使用的语言) 与 js 交互的文章都比较适用于 mac开发,iOS的webview 还是有所不一样, 参考:http://blog.sina.com.cn/s/blog_693de6100102vhuh.html 本文提供了一个很好解决 交互的思路. 自然,从oc到js,可以使用 stringByEvaluatingJavaScr

UIWebView与JavaScript(JS) 回调交互 -备

很多关于objc 与 js 交互的文章都比较适用于 mac开发,iOS的webview 还是有所不一样, 参考:http://blog.sina.com.cn/s/blog_693de6100102vhuh.html 本文提供了一个很好解决UIWebView内js和objc 交互的思路. 自然,从oc到js,可以使用 stringByEvaluatingJavaScriptFromString: 来实现. 从js到oc,采用比较巧妙的设计,UIWebView浏览器拦截 url请求,自定义url的

IOS中UIWebView和JavaScript交互(转自http://blog.2jun.net/2012/11/02/webviewandjs/)

IOS中UIWebView和JavaScript交互 当程序中使用到UIWebView控件的时候,难免会遇到需要与页面进行交互的情况.这种情况在android平台下比较容易处理,android平台下WebView控件的addJavascriptInterface()方法可以很轻松的完成交互,而IOS上就稍复杂一些. 页面与客户端的交互是通过JS来完成的,通常情况下与JS的交互可以分为两种:客户端传递给JS一些数据和JS向客户端请求一些本地操作.下面分别对这两种情况进行处理. JS向客户端请求本地

ios的UIWebView与js交互的有关知识

一.UIWebView与JavaScript的交互 源地址:http://blog.sina.com.cn/s/blog_74e9d98d010199jc.html 总体概述:       实质上oc与js的通信交互就是发送消息,也即函数调用,只要在交互的过程正确的指定好对方需要调用的函数和参数就ok oc-->js  stringByEvaluatingJavaScriptFromString,其参数是一NSString 字符串内容是js代码(这又可以是一个js函数.一句js代码或他们的组合)

iOS UIWebView与JavaScript的交互 相关资料

UIWebView自适应宽度 iOS UIWebView中javascript与Objective-C交互.获取摄像头 iOS中JavaScript和OC交互 iOS与js交互,获取webview完整url,title,获取元素并赋值跳转 示例 https://github.com/shaojiankui/WebViewJS wanggang316/ClickWebViewImage 点击webview上的图片,调用js获取,展示,保存