UIWebView与JS交互

webview加载状态:

a、uninitialized : 还没开始加载

b、loading : 加载中

c、loaded : 加载完成

d、interactive : 结束渲染,用户已经可以与网页进行交互。但内嵌资源还在加载中

e、complete : 完全加载完成

WebViewDidFinishLoad 被调用时,readyState 可能处在 interactive 和 complete 两种状态。当我们需要对网页中的元素进行修改时,最好在 complete 状态进行,不然我们的修改可能被重置。

1、获取当前网页内容:

 [wwjWebViewstringByEvaluatingJavaScriptFromString:@"document.body.innerText"];

注:需要注意网页渲染完成与加载完成不同时机插入返回的值不同;特别是有js动态改变网页内容,网页渲染完成js不一定就加载完成,所以需注意js的插入时机;

2、获取当前网页的所有标签:

[wwjWebViewstringByEvaluatingJavaScriptFromString:@"document.body.innerHTML"];

3、通过js获取网页的加载完成状

[wwjWebViewstringByEvaluatingJavaScriptFromString:@"document.readyState"];

4、插入js函数

[webViewstringByEvaluatingJavaScriptFromString:@"var script = document.createElement('script');"

"script.type = 'text/javascript';"

"script.text = \"function alertTest(str){"

"alert(str);"

"}\";"

"document.getElementsByTagName('body')[0].appendChild(script);"];

[webView stringByEvaluatingJavaScriptFromString:[NSString stringWithFormat:@"alertTest('%@');",@"test"]];

5、通过js隐藏网页标签或元素

(1)通过document.getElementById('xxx')、document.getElementByTagName('xxx')、document.getElementByClassName('xxx')获取对应标签进行设置

[webViewstringByEvaluatingJavaScriptFromString:@"document.getElementByClassName('xxx').style.display = 'none';"];

注:这段js的插入必须是网页回载完成以后,放在webview的代理- (void)webViewDidFinishLoad:(UIWebView*)webView去插入这一句未必有用,因为执行这一代理的时候,webview未必加载完成,若网页还有其他js对需改动的标签进行设置,那么在这里插入就会被覆盖;

(2)通过设置未被js动态改变的标进行假隐藏

[webViewstringByEvaluatingJavaScriptFromString:

@"var tagHead =document.documentElement.firstChild;"

"var tagStyle = document.createElement(\"style\");"

"tagStyle.setAttribute(\"type\", \"text/css\");"

"tagStyle.appendChild(document.createTextNode(\"#header{height: 0pt; visibility:hidden;}\"));"

"var tagHeadAdd = tagHead.appendChild(tagStyle);"];

注:这里通过js注入一个方法改标标签的宽、高,并将标签对应的内容隐来达到自己想要的效果;

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

推荐阅读更多精彩内容

  • UIWebView的三种加载方式和其代理API 提供了三种方法:1.- (void)loadRequest:(NS...
    JamesYi阅读 710评论 0 0
  • 众所周知,随着硬件水平的发展,HTML5 与原生 APP 性能差距不断缩小,正在互联网科技领域扮演者越来越重要的角...
    OneAPM阅读 742评论 0 4
  • 开发中一些界面如果使用OC代码进行编写会十分复杂,我们经常会使用到webView来呈现一个事先用HTML编写好的网...
    ShenYj阅读 668评论 0 3
  • 我们做WbeView与js交互,很多时候是使用JavaScriptCore来进行操作,但是使用JavaScript...
    jy__Lu阅读 1,433评论 3 1
  • 画完了一幅画又爬到床上,只是累了想休息一会儿。 心里又确定了一些事,给自己更多鼓励。希望每天都是充满正能量的。 宁...
    汤妹子阅读 317评论 2 5