iOS浅谈webView的JS一种用法.(去掉web显示页的广告)

你觉得累吗? 累就对了,因为舒服是给死人准备的 ..

今天遇到了webView 中网页显示的问题,大家都知道webView的强大之处,因为webView根据url(统一资源定位符)不但可以显示本地的资源,而且还可以显示网络上的一些数据,大大减少了我们代码量,只要看好了一个网页我们直接拿来了用就行,但是往往这些网页中有一些是我们所不需要的东西.比如广告了,一些链接啦,大大降低了我们的应用程序的美观.如下图

下载链接 ,分享都不是我们所需要的

对于这样的问题,像我这小菜鸟真是脑洞再大也解决不了,幸得大神帮助,给我推荐一篇的博客.成功的解决了问题.

----> 点击此处进入原文博客

根据大牛的思路,总共分这么几步


1.使用工具获取到你想要获取到页面上的控件(ccs操作???不懂...)

选择谷歌浏览器,打开开发者工具


2.打开开发者工具 ,我们用到的地方如下图

需要用到的地方
Device:你要选择在那种情境下显示网页,通俗来说,就是模拟器
放大镜:你可以通过放大镜对网页上的控件进行选取,然后找到html代码.(重要的第一步呀)
手机:转化为手机模式,但是前提必须要转换Device的模式,要不然,光是视图上的转变,没有实际的转变(注意:我现在拿手机的网页做示例,所有我需要转化,当你做的电脑的就不需要转换这些了)


3.查找到我们所需要的控件(JS操作)

3.1点击放大镜,这样我们就可以对网页上的控件进行选取了;

放大镜


3.2选取你要取消网页上的控件(单击就行),这时候你就会发现html代码有一部分被选中(右下边可以直接被编辑)


三部曲


3.3我们在右下边可以直接填上下面这行代码,直接完成广告的去除,但这不是我们要的效果,我们要的效果是通过OC来去除广告,心急吃不了热豆腐,请执行下面代码

display:none (这行代码这右下边的编辑区任意地方写就行 如图)

看看我们代码写在哪!



3.4上面就是给你个希望而已,不要激动,精彩的在后面,我们看到了取出效果之后,我们就要找到class内的字符串,这里我们就要'g-mnc1'就行.

取出我们所需要的东西

紧接着打开控制台Console 输入如下代码 回车

document.getElementsByClassName('这里写你要消除的空间的class里面的字符串')

如图所示

输入代码

紧接着打开数组中的第一个元素 输入如下代码 回车

document.getElementsByClassName('这里写你要消除的空间的class里面的字符串')[0]

如图所示

获取第一个元素

又接着,我是真够了又接着了...重复呀!!够够的了.(这才是我们最终所需要的!!!注意啦)

document.getElementsByClassName('这里写你要消除的空间的class里面的字符串')[0].style.display = 'none'

效果图

4.验证完成之后,我们就需要对我们的UIwebView进行操作了,这里我就直接引用大牛的文章了(iOS操作)(这两天身体不适,改天再写了,抱歉了)


1.创建UIWebView
2.设置代理
3.加载网络请求

注意:顺序问题很重要,不懂的直接当CV战士吧,尽情的复制黏贴吧,吼吼

//创建webview
self.webview = [[UIWebView alloc] initWithFrame:self.view.frame];
[self.view addSubview:_webview];
//设置代理
self.webview.delegate = self;
//发送请求
[_webview loadRequest:[NSURLRequest requestWithURL:[NSURL URLWithString:@"http://m.haodou.com/topic-327282.html?id=327282"]]];

我们可以通过webView的代理方法进行我们 JS操作(如下) 方法:
- (void)webViewDidFinishLoad:(UIWebView *)webView



#pragma mark - UIWebViewDelegate
- (void)webViewDidFinishLoad:(UIWebView *)webView{
    [webView stringByEvaluatingJavaScriptFromString:@"document.documentElement.getElementsByClassName('adpic')[0].style.display = 'none'"];
}

然后我们所需要的效果就出来了;新鲜的,来两口 .屏蔽webView中的广告完成.

总结:document.documentElement.getElementsByClassName('这里写你要消除的空间的class里面的字符串')[0].style.display = 'none' 是我们今天的重点

最后感谢大牛的博客

----> 点击此处进入原文博客

有钱的点个喜欢,不要钱了,没钱的也来也喜欢了 谢谢大家了,呜呜....

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 利用Javascript去操作UIWebView的内容 Web背景知识 web 时代三剑客 html + css ...
    myk阅读 7,127评论 5 14
  • http://www.cnblogs.com/mddblog/p/5281748.html 一、整体介绍 UIWe...
    F麦子阅读 1,266评论 0 2
  • IOS之UIWebView的使用 刚接触IOS开发1年多,现在对于 混合式 移动端开发越来越流行,因为开发成本上、...
    学无止境666阅读 45,914评论 5 53
  • 各位伙伴大家好,马上会有很多家长给我们报学生的成绩,和家长进行沟通的时候,特别是微信进行沟通的时候,注意一下几个问...
    16e2c83b34c5阅读 1,111评论 0 0
  • 天空阴沉,貌似要来一场风雪才能让气候变得清明!推窗向外,雾霾笼罩着……偶尔也会看得清远方的大气层透出清朗的明亮,心...
    蟹公子阅读 1,446评论 6 15