iOS UIWebView截获html并修改便签内容

UIWebView使用中经常遇到用JS来处理的事情,今天又遇到了搜了搜,找了这篇文章 感觉不错 珍藏一下。

原文地址 http://jiapumin.iteye.com/blog/1558345    感谢原作者jiapumin

需求:混合应用UIWebView打开html后,UIWebView有左右滚动条,要去掉左右滚动效果; 
方法:通过js截获UIWebView中的html,然后修改html标签内容; 
实例代码: 
服务器端html

  1. <html><head>
  2. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  3. <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
  4. <title>网曝四川省一考场时钟慢半小时 老师称这就是命</title></head<body>网曝四川省一考场时钟慢半小时 老师称这就是命</body></html>

这样显示的结果网页的最小宽度会是device-width;但有时候不需要这个宽度,就需要修改width=device-width为width=myWidth; 
客户端代码

  1. - (void)webViewDidFinishLoad:(UIWebView *)webView
  2. {
  3. //修改服务器页面的meta的值
  4. NSString *meta = [NSString stringWithFormat:@"document.getElementsByName(\"viewport\")[0].content = \"width=%f, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no\"", webView.frame.size.width];
  5. [webView stringByEvaluatingJavaScriptFromString:meta];
  6. }

这样问题就可以解决了

新增代码:

  1. //给网页增加utf-8编码
  2. [webView stringByEvaluatingJavaScriptFromString:
  3. @"var tagHead =document.documentElement.firstChild;"
  4. "var tagMeta = document.createElement(\"meta\");"
  5. "tagMeta.setAttribute(\"http-equiv\", \"Content-Type\");"
  6. "tagMeta.setAttribute(\"content\", \"text/html; charset=utf-8\");"
  7. "var tagHeadAdd = tagHead.appendChild(tagMeta);"];
  1. //给网页增加css样式
  2. [webView stringByEvaluatingJavaScriptFromString:
  3. @"var tagHead =document.documentElement.firstChild;"
  4. "var tagStyle = document.createElement(\"style\");"
  5. "tagStyle.setAttribute(\"type\", \"text/css\");"
  6. "tagStyle.appendChild(document.createTextNode(\"BODY{padding: 20pt 15pt}\"));"
  7. "var tagHeadAdd = tagHead.appendChild(tagStyle);"];
  1. //拦截网页图片  并修改图片大小
  2. [webView stringByEvaluatingJavaScriptFromString:
  3. @"var script = document.createElement(‘script‘);"
  4. "script.type = ‘text/javascript‘;"
  5. "script.text = \"function ResizeImages() { "
  6. "var myimg,oldwidth;"
  7. "var maxwidth=380;" //缩放系数
  8. "for(i=0;i <document.images.length;i++){"
  9. "myimg = document.images[i];"
  10. "if(myimg.width > maxwidth){"
  11. "oldwidth = myimg.width;"
  12. "myimg.width = maxwidth;"
  13. "myimg.height = myimg.height * (maxwidth/oldwidth);"
  14. "}"
  15. "}"
  16. "}\";"
  17. "document.getElementsByTagName(‘head‘)[0].appendChild(script);"];
  18. [webView stringByEvaluatingJavaScriptFromString:@"ResizeImages();"];

其他html属性重载和此方法类似; 
参考网址: 
(stringByEvaluatingJavaScriptFromString的使用方法)http://www.uml.org.cn/mobiledev/201108181.asp   
( iphone 获取UIWebView内Html方法)http://blog.csdn.net/diyagoanyhacker/article/details/6564897 
(IOS UIWebView引用外部CSS样式)http://hi.baidu.com/jwq359699768/item/780879e5c98bfb3e4ddcaf22 
http://blog.csdn.net/xdonx/article/details/6973521

时间: 2024-10-20 19:00:45

iOS UIWebView截获html并修改便签内容的相关文章

IOS UIWebView截获html并修改便签内容,宽度自适应

需求:混合应用UIWebView打开html后,UIWebView有左右滚动条,要去掉左右滚动效果:  方法:通过js截获UIWebView中的html,然后修改html标签内容:  实例代码:  服务器端html Java代码   <html><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="

MindManager便签内容粘贴到开发工具时出错

最近一直在使用MindManager来整理我的教学资料,经常会将关键代码.数据库脚本等内容放在便签里,方便查看和使用 ,我习惯性Ctl+S保存文档,以为万事大吉了,没有想到,第二天我给学生上课时复制便签的内容到开发环境里去出错了?这是为什么了? 经过一番研究问题总算得到了解决. 原因:MindManager默认采用UTF-8格式保存 ,保存前MindManager还会进行压缩包括空格,而MindManager对空格的压缩是有Bug的,对于文档的内容阅读没有任何影响,但不代表对我们的程序文档没有影

Android Widget 开发实例:桌面便签程序的实现详解和源码

桌面便签软件是Android上常用软件的一种,比如比较早的Sticky Note,就曾非常流行,而实际上使用android平台对widget开发的支持,桌面便签类软件是非常易于开发的. 本文通过逐步实现一个简单的桌面便签软件,和大家分享进行widget开发的过程和方法. 同时本程序提供完整的工程源码下载 免费下载地址在 http://linux.linuxidc.com/ 用户名与密码都是www.linuxidc.com 具体下载目录在 /pub/Android源码集锦/2011年/10月/An

《团队-手机便签-需求分析》

功能需求: 便签管理: 1.添加便签: (1)功能描述: 用户通过程序新建便签,保存便签内容; (2)前提条件:已启动便签,进入写便签页面; (3)成功场景:返回即保存,自动保存便签内容; (4)失败场景:弹出失败提示,并指示正确操作提示; 2.修改便签:   (1)功能描述:对已经有的便签进行修改操作: (2)前提条件:已启动的便签,进入写便签界面: (3)成功场景:用户选定便签   用户将便签中内容做修改   确定返回即保存 (4)失败场景:弹出失败提示,并指示正确操作提示;   3.查询便

便签小项目总结

这一个月,自己开发了一个android小项目,xin便签的管理,它可以添加.删除.修改便签,同时还可以给便签设置相应的铃声,也可以添加删除文件夹,将便签移入或移出文件夹,通过小项目的开发,对自己之前学的android基础知识进行了一个小小的总结,基本上用到了Activity.Service.Content provider.BroadcastReceiver四大组件,以及数据库的操作SQLiteDatabase.Handler使用.ListView和自定义适配器的灵活运用.AlarmManage

android widget 开发实例 : 桌面便签程序的实现具体解释和源代码 (上)

如有错漏请不吝拍砖指正,转载请注明出处,很感谢 桌面便签软件是android上经常使用软件的一种,比方比較早的Sticky Note,就曾很流行, Sticky Note的介绍能够參见 http://www.tompda.com/c/article/11778/ 而实际上使用android平台对widget开发的支持,桌面便签类软件是很易于开发的. 本文通过逐步实现一个简单的桌面便签软件,和大家分享进行widget开发的过程和方法. 1.MyNote的终于实现效果 为了提起大家阅读本文的兴趣,先

魅族便签,能否成为国内便签应用的No.1?

继前不久锤子科技推出便签 Android 新版后,最近魅族在PRO 6发布会上也发布了最新的魅族便签应用,这一次魅族把便签应用拓展到了整个Android体系,也就是说,其他任何的Android手机也可以下载使用.当然,除了这两个厂商之外,其他一些厂商也推出了类似的便签应用,便签应用之所以会被厂商所重视,一个重要原因在于,它已成为移动互联网的一项基础应用. 对标锤子,老罗你怎么看? 坦白说,魅族这次将便签应用拓展到整个Android体系,大有与锤子便签对标的意思,那么二者究竟有什么区别,谁更胜一筹

iOS UIWebView 加载https站点出现NSURLConnection/CFURLConnection HTTP load failed (kCFStreamErrorDomainSSL,

今天在加载https站点的时候遇到如下的错误问题.所以对自己之前写的iOS内嵌webview做了一些修改,可以让它加载http站点也可以让它加载https站点. 下面是我加载https站点的时候出现的错误. error:     NSURLConnection/CFURLConnection HTTP load failed (kCFStreamErrorDomainSSL, -9813) HTTPS 超文本传输安全协议(缩写:HTTPS,英语:Hypertext Transfer Protoc

PyQt 实战:简易便签软件的制作

便签软件 为什么写便签软件 一直都有做一个笔记软件的想法,而我给笔记软件设计的一个特色功能就是它的便签功能.不过由于各种原因,笔记软件无法完成,但是他的便签功能也可以脱离笔记单独存在.不过功能也随着有着相应的变化 我们可能每天都需要一个计划表来帮助我们更加高效的工作,在windows上我们可能会使用它自带的便签软件,也有一些其他的改进版,但是我认为他们不够友好.于是我非常期待一个功能出色的便签.(我自己写的这个也只能说是个雏形,需要以后进行加工) 它具有什么特点 我和几个同学交流过,从用户角度上