WebView加载页面时隐藏页面内的某一个标签

通过getElementById()、getElementByTagName()、getElementByClassName()获取标签

1、通过修改display实现隐藏

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

注: 这里有一个问题,就是这一句必须在webview完全加载完成之后插入,特别是有外边的js设置display的时候,更需要注意插入的时机,如果只是单纯在webViewDidFinishLoad里插入的话,可能实现不了想要的效果,因为webview执行到这里时,并不一定完全加载完成了,所以注时还会被没有加载完成的js覆盖,而且插入成功后,在webview重新加载之后,还会被覆盖而达不到想要隐藏的效果。

2、通过css实现隐藏

[webView stringByEvaluatingJavaScriptFromString: @"var tagHead =document.documentElement.firstChild;" "var tagStyle = document.createElement(\"style\");" "tagStyle.setAttribute(\"type\", \"text/css\");" "tagStyle.appendChild(document.createTextNode(\"#header{height: 0pt; ;}\"));" "var tagHeadAdd = tagHead.appendChild(tagStyle);"];

注: 这里通过添加一个新的width、height的样式,并将标签内容隐藏以实现效果,但并没有实现真正的隐藏,只是把宽、高设置为0,而标签还在页面上,好处就是不需要注意js的插入时机,只要在webViewDidFinishLoad调用就可以了,也不会出现被覆盖的情况;

webview加载状态:

a、uninitialized : 还没开始加载

b、loading : 加载中

c、loaded : 加载完成

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

e、complete : 完全加载完成

WebViewDidFinishLoad 被调用时,readyState 可能处在 interactive 和 complete 两种状态。当我们需要对网页中的元素进行修改时,最好在 complete 状态进行,不然我们的修改可能被重置。 [wwjWebViewstringByEvaluatingJavaScriptFromString:@"document.readyState"] 通过这句可以通过js获取webview不同的加载状态。

© 著作权归作者所有,转载或内容合作请联系作者

推荐阅读 更多精彩内容