JS和OC交互的简单应用
先简单地说一下思路吧
- 需求:在App中嵌入一个webView,已经有了网址,但是需要去掉这个网页中的一些内容
- 解决方案:取到webView要加载的网址,对这个网址对应的网页信息进行修改
- 简单描述:
- 遵守webView的协议
<UIWebViewDelegate>
- 设置代理
- 实现相应代理方法,对网页信息中要删除的内容对应到节点,并删除
- 删除的部分处理:获取到相应的节点并执行删除操作的语句写法有三种方式:见http://www.w3school.com.cn/js/js_htmldom.asp
- 遵守webView的协议
#import "JSHanledWebViewController.h" //1.遵守协议
@interface JSHanledWebViewController ()<UIWebViewDelegate>
@property (weak, nonatomic) IBOutlet UIWebView *webView; @end @implementation JSHanledWebViewController - (void)viewDidLoad {
[super viewDidLoad]; //2.设置代理
self.webView.delegate = self;
[self loadWebView]; } #pragma mark - 加载webView
- (void)loadWebView{ [self.webView loadRequest:[NSURLRequest requestWithURL:[NSURL URLWithString:@"http://m.dianping.com/tuan/deal/66666"]]];
//关闭webView的弹簧效果
self.webView.scrollView.bounces = NO;
//隐藏滚动条
self.webView.scrollView.showsVerticalScrollIndicator = NO; } //3.实现相应代理方法
#pragma mark - Sent after a web view finishes loading a frame.
- (void)webViewDidFinishLoad:(UIWebView *)webView{ NSMutableString *jsStrM = [NSMutableString string]; //参考w3c: http://www.w3school.com.cn/js/js_htmldom.asp
//注意取出来的是个数组,注意指定下标
//取到顶部的导航栏
[jsStrM appendString:@"var header = document.getElementsByTagName('header')[0];"];
[jsStrM appendString:@"header.parentNode.removeChild(header);"]; //取到网页轮播器下的 立即购买
[jsStrM appendString:@"var costBox = document.getElementsByClassName('cost-box')[0];"];
[jsStrM appendString:@"costBox.parentNode.removeChild(costBox);"]; //取到灰色的立即购买
[jsStrM appendString:@"var buy = document.getElementsByClassName('buy-now btn-gray')[0];"];
[jsStrM appendString:@"buy.parentNode.removeChild(buy);"]; //取到底部的首页 点评团...
[jsStrM appendString:@"var footer = document.getElementsByClassName('footer')[0];"];
[jsStrM appendString:@"footer.parentNode.removeChild(footer);"]; //取到黄色的立即购买按钮
[jsStrM appendString:@"var footerBtn = document.getElementsByClassName('footer-btn-fix')[0];"];
[jsStrM appendString:@"footerBtn.parentNode.removeChild(footerBtn);"]; //The stringByEvaluatingJavaScriptFromString: method waits synchronously for JavaScript evaluation to complete.
[webView stringByEvaluatingJavaScriptFromString:jsStrM]; } @end
- 最终的效果如下所示

如有问题,敬请指正!
JS和OC交互的简单应用的更多相关文章
- JS与OC交互--简单使用
直接上代码 .m文件 #import "ViewController.h" @interface ViewController () <UIWebViewDelegate&g ...
- 史上最全的 UIWebview 的 JS 与 OC 交互
来源:伯乐在线 - 键盘风筝 链接:http://ios.jobbole.com/89330/ 点击 → 申请加入伯乐在线专栏作者 其实一直想给大家整理一下JS与OC的交互,但是没有合适的机会,今天借 ...
- MXBridge - 插件式JS与OC交互框架
概述 MXBridge,提供一个插件式的JavaScript与Objective-C交互的框架,通过JavaScriptCore实现,插件式扩展Obejctive-C接口以供JavaScript调用. ...
- 转载 【iOS开发】网页JS与OC交互(JavaScriptCore) OC ----->JS
目标 本文介绍利用苹果在iOS7时发布的JavaScriptCore.framework框架进行js与OC的交互.我们想要达到的目标是: OC调用网页上的js方法 网页js调用APP中的OC方法 ...
- JS 与OC 交互篇
完美记录交互 CSDN博客: (OC调用JS) http://blog.csdn.net/lwjok2007/article/details/47058101 (JS调用OC) http://blog ...
- UIWebView中JS与OC交互 WebViewJavascriptBridge的使用
一.综述 现在很多的应用都会在多种平台上发布,所以很多程序猿们都开始使用Hybrid App的设计模式.就是在app上嵌入网页,只要写一份网页代码,就可以跑在不同的系统上.在iOS中,app多是通过W ...
- iOS JS 和 OC交互 / JS 和 native 相互调用
现在app 上越来越多需求是通过UIWebView 来展示html 或者 html5的内容, js 和 native OC代码交互 就非常常见了. js 调用 native OC代码 第一种机制 ( ...
- 利用WKWebView实现js与OC交互注意事项
最近在写一些关于wkwebview的一些代码,发现了几点心得,记录一下. 1.js调用OC 我是利用wkwebview进行的开发实现,主要代码有三部分 1.向config注入OC对象 [config. ...
- JS与OC交互,JS中调用OC方法(获取JSContext的方式)
最近用到JS和OC原生方法调用的问题,查了许多资料都语焉不详,自己记录一下吧,如果有误欢迎联系我指出. JS中调用OC方法有三种方式: 1.通过获取JSContext的方式直接调用OC方法 2.通过继 ...
随机推荐
- UNITY VR 视频/图片 开发心得(一)
现在的VR似乎没有之前那么火热了,于是乎我居然开始了VR征程... 说起VR,对于没有接受过相关知识的人来说可能看起来比较高大上,但是VR的原理却没有想象中那么复杂.总的来说,VR之所以能够产生立体感 ...
- [图形学] Chp8.4 OpenGL 二维观察函数——视口
这节有几个显示窗口的控制函数,可以调整视口,创建子窗口,最小化为图标,设置图标名称,隐藏显示等. gluOrtho2D (xwmin, xwmax, ywmin, ywmax); // 定义二维裁剪窗 ...
- (转载)DBCP、C3P0、Proxool 、 BoneCP开源连接池的比较
原文链接: http://blog.csdn.net/miclung/article/details/7231553 简介 使用评价 项目主页 DBCP DBCP是一个依赖Jakarta ...
- haproxy+tomcat集群搭建
web1和web2的部署可参考我之前的文章<Tomcat集群搭建>,这里就省去该过程了. #安装haproxy- .tar.gz cd haproxy-/ make TARGET=linu ...
- Elasticsearch学习随笔(二)-- Index 和 Doc 查询新建API总结
本文着重总结Elasticsearch的常见API了,进行分析. Index API 初始化Index,设置shards和replica PUT http://localhost:9200/firew ...
- 【前端】用jQuery实现瀑布流效果
jQuery实现瀑布流效果 何为瀑布流: 瀑布流,又称瀑布流式布局.是比较流行的一种网站页面布局,视觉表现为参差不齐的多栏布局,随着页面滚动条向下滚动,这种布局还会不断加载数据块并附加至当前尾部.最早 ...
- OCP 11G 实验环境安装文档 ( RedHat5.5 + Oracle11g )
RedHat5.5 linux下Oracle11g软件安装 一.配置虚拟机 为了创建和配置虚拟机,你需要添加硬件设备如磁盘和cpu,在你开始安装之前,创建一个windows目录作为存放虚拟机的目录 目 ...
- css动画属性--小球移动
主体只有一个div <body> <div></div> </body> 样式部分(测试:目前的浏览器还是需要加前缀才能兼容) <style> ...
- Qt中使用CEF(Windows下)
最近项目中要在Qt中使用CEF(Chromium Embedded Framework),在这里总结下其中的几个要点. 下载合适的CEF版本 关于CEF的简介我们这里就不做介绍了,下载CEF可以有2种 ...
- CSS边框(圆角、阴影、背景图片)
1.圆角 border-radius是向元素添加圆角边框. 使用方法: border-radius:10px; /* 所有角都使用半径为10px的圆角 */ border-radius: 5px 4 ...