WebView与JS交互

有时我们会用webView来显示网络上的一些数据,大大减少了我们代码量,只要看好了一个网页我们直接拿来了用就行,但是往往这些网页中有一些是我们所不需要的东西.比如广告了,一些链接啦,大大降低了我们的应用程序的美观 ;
文章里我用了这个 参考网址

1.首先用谷歌浏览器打开你需要用的网址 , 然后直接按command+option+l , 或者执行下图的操作打开开发者工具

开发者工具

2.然后我们会进入到下图的页面 , 点击做了标记的地方 ,切换设备的模式

切换成手机模式

3.接下来页面会变成这样 : 你可以在做了标记的地方选择设备的型号 , 这里我选择了iphone6的

选择设备类型

接下来就是最重要的几步了:​

(1)一开始鼠标在网页上是变成一个黑的圆圈的,这时我们可以执行拖的动作 , 当你想找到你需要的控件时 , 你需要点击刚刚切换设备的按键隔壁的一个箭头标记的按键 , 这时你就可以点击页面上的任意地方来查看他的相应代码

具体步骤

(2)当你一点击上图的第二步 , 第三步有一行代码背景就会变成灰色的 , 那一行就是相应的代码 , 紧接着打开控制台Console 输入如下代码 回车

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

比如上图中我们需要删除第二步的控件 , 我们就​可以在console输入

document.getElementsByClassName('new-art-author')[0].style.display = 'none'

再按回车 , 神奇的事情发生了 , 控件不见了​

...

这样我们就成功的删除掉不需要的控件了 , 但是这里只是我们验证代码的正确性而已 !!!

具体操作我们要在代码中执行:

1.创建webview

  self.webview = [[UIWebView alloc] initWithFrame:self.view.frame];

[self.view addSubview:_webview];

2.​设置代理

  self.webview.delegate =self;

​3.发送请求

  [_webview loadRequest:[NSURLRequest requestWithURL:[NSURL URLWithString:@"http://app.vmoiver.com/48806?qingapp=app_new&debug=1"]]];​

4.通过webView的代理方法进行我们JS操作:

  -(void)webViewDidFinishLoad:(UIWebView*)webView{
   [_webViewstringByEvaluatingJavaScriptFromString:@"document.getElementsByClassName('hot-list m0')[0].style.display = 'none'"];
   [_webViewstringByEvaluatingJavaScriptFromString:@"document.getElementsByClassName('item-title fs')[0].style.display = 'none'"];
   [_webViewstringByEvaluatingJavaScriptFromString:@"document.getElementsByClassName('new-art-author')[0].style.display = 'none'"];
  }

------------------------------end-----------------------------