以前用得不多,先开一篇,以后有遇到再补充。

1、返回

2、JS 调用 OC

3、获取、修改、添加、删除网页信息

1、返回

if (self.mWebView.canGoBack == YES) {
[self.mWebView goBack];
}else{
//提示
};

2、JS 调用 OC

  2-1)、添加 和 JS 约定的消息名

[self.userContentController addScriptMessageHandler:self  name:@"约定的消息名"];

  2-2)、得到 JS 消息

#pragma mark - WKScriptMessageHandler
- (void)userContentController:(WKUserContentController *)userContentController didReceiveScriptMessage:(WKScriptMessage *)message
{
if ([message.name isEqualToString:@"约定的消息名"]) {
NSLog(@"传过来的value为:%@", message.body[@"约定的key"]);
}
}

  2-3)、移除

- (void)viewWillDisappear:(BOOL)animated{
[super viewWillDisappear:animated]; [self.userContentController removeScriptMessageHandlerForName:@"约定的消息名"];
}

补充:这步最为重要,如果不移除,将得不到释放,比如H5的音乐在退出该VC(dealloc) 还会一直响。

附:JS代码

function isAndroid(argument) {
var u = navigator.userAgent;
var flag = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
return flag;
} function isIOS(argument) {
var u = navigator.userAgent;
var flag = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
return flag;
} function share(要传的value) {
if(isAndroid()){ } else if(isIOS()) {
window.webkit.messageHandlers.约定的消息名.postMessage({
"约定的key": 要传的value
});
}
}

3、获取、修改、添加、删除网页信息

  3-1)、获取

    3-1-1)、获取网页数据

[webView evaluateJavaScript:@"document.body.outerHTML" completionHandler:^(id _Nullable htmlStr, NSError * _Nullable error) {
NSLog(@"htmlStr = %@",htmlStr);
}];

    3-1-2)、获取网页高度,看需更新高度(如高度固定,网页内部能滑动,如更改高度为当前高度,网页不能滑动)

[webView evaluateJavaScript:@"document.body.scrollHeight" completionHandler:^(id result, NSError *_Nullable error) {
}];

  补充:如计算出来的高度偏大、字体、图片偏小,可能是没自适应,需要对其修改。

      参照 “3、获取、修改、添加网页信息” -> “3-3)、添加” -> “3-3-1)、自适应图片” 和 “3-3-2)、自适应文字”

  3-2)、修改

    3-2-1)、修改背景、文字颜色

[webView evaluateJavaScript:@"document.body.style.backgroundColor=\"#72ADFC \"" completionHandler:nil];
[webView evaluateJavaScript:@"document.body.style.webkitTextFillColor= '#FFFFFF'"completionHandler:nil];

    3-2-2)、修改网页内容(比如:图片)

[webView evaluateJavaScript:@"document.getElementsByClassName('图片xxx')[0].src='http://www.测试测试.com/测试测试.jpg'" completionHandler:^(id _Nullable htmlStr, NSError * _Nullable error) {
// 延时再显示(否则之前的图片会显示出来,再刷新当前设置的图片,一闪而过)
dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(0.5 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
// 显示
self.mainWebView.hidden = NO;
});
}];

  3-3)、添加

    3-3-1)、自适应图片。比如 @"document.body.scrollHeight" 算出来感觉偏大,图片偏小。需要在在html字符串增加数据

flexHtmlString = [NSString stringWithFormat:@"<html><head><meta content=\"width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0\" name=\"viewport\"><style type=\"text/css\">img{display: inline-block;max-width: 100%%}</style></head><body>\%@</body></html>",htmlString];

    3-3-2)、自适应文字。比如 @"document.body.scrollHeight" 算出来感觉偏大,文字偏小。需要设置WKUserScript

NSString *jScript = @"var meta = document.createElement('meta'); meta.setAttribute('name', 'viewport'); meta.setAttribute('content', 'width=device-width'); document.getElementsByTagName('head')[0].appendChild(meta);";

WKUserScript *wkUScript = [[WKUserScript alloc] initWithSource:jScript
injectionTime:WKUserScriptInjectionTimeAtDocumentEnd
forMainFrameOnly:YES];
WKUserContentController *wkUController = [[WKUserContentController alloc] init];
[wkUController addUserScript:wkUScript];

    3-3-3)、添加高度参数,源数据没style。

[webView evaluateJavaScript:@"document.getElementsByClassName('图片xxx')[0].style='width: 70px;height:auto !important;'" completionHandler:^(id _Nullable htmlStr, NSError * _Nullable error) {
}];

  3-4)、删除

    3-4-1)、删除子项

[webView evaluateJavaScript:@"document.body.removeChild(document.getElementsByClassName('xxx')[0])" completionHandler:^(id _Nullable htmlStr, NSError * _Nullable error) {
}];

    3-4-2)、删除子项中的子项

[webView evaluateJavaScript:@"document.body.getElementsByClassName('xxx1')[0].removeChild(document.getElementsByClassName('xxx1')[0].getElementsByClassName('xxx2')[0])" completionHandler:^(id _Nullable htmlStr, NSError * _Nullable error) {

}];

iOS:WKWebView(19-01-31更)的更多相关文章

  1. iOS WKWebview 网页开发适配指南

    iOS WKWebview 网页开发适配指南 微信iOS客户端将于2017年3月1日前逐步升级为WKWebview内核,需要网页开发者提前做好网站的兼容检查和适配.如有问题,可参考文末联系方式,向我们 ...

  2. 编写高质量代码改善C#程序的157个建议——建议19:使用更有效的对象和集合初始化

    建议19:使用更有效的对象和集合初始化 依赖于属性和FCL 3.5之后的语法规则,现在我们有了更加简洁有效的对象和集合初始化机制:对象和集合初始化设定项. 对象初始化: class Person { ...

  3. iOS 9适配技巧(更新版)

    转自:   http://www.cocoachina.com/ios/20150929/13598.html 中文快速导航: 1.iOS9网络适配_ATS:改用更安全的HTTPS(见Demo1) i ...

  4. iOS:动画(18-10-15更)

    目录 1.UIView Animation 1-1.UIView Animation(基本使用) 1-2.UIView Animation(转场动画) 2.CATransaction(Layer版的U ...

  5. iOS WKWebView详解

    UIWebView就不用说了,这个过时了,现在iOS8以后建议都使用WKWebView. WKWebView 是现代 WebKit API 在 iOS 8 和 OS X Yosemite 应用中的核心 ...

  6. ios WKWebView 与 JS 交互实战技巧

    一.WKWebView 由于Xcode8发布之后,编译器开始不支持iOS 7了,这样我们的app也改为最低支持iOS 8.0,既然需要与web交互,那自然也就选择使用了 iOS 8.0之后 才推出的新 ...

  7. iOS WKWebView

    Webkit 是 iOS 8.0 后提供的新的框架,组件WKWebView比较UIWebView 速度更快.占用内存更少了,可支持性更多 WKWebView可通过KVO监听属性 title.estim ...

  8. iOS开发,让数据更安全的几个加密方式

    任何应用的开发中安全都是重中之重,在信息交互异常活跃的现在,信息加密技术显得尤为重要.在app应用开发中,我们需要对应用中的多项数据进行加密处理,从而来保证应用上线后的安全性,给用户一个安全保障.这篇 ...

  9. 微信iOS WKWebview 网页开发适配指南

    微信iOS客户端将于2017年3月1日前逐步升级为WKWebview内核,需要网页开发者提前做好网站的兼容检查和适配. 背景 WKWebView 是苹果在iOS 8中引入的新组件,目的是提供一个现代的 ...

  10. iOS WKWebview 网页开发适配指南【转】

    微信iOS客户端将于2017年3月1日前逐步升级为WKWebview内核,需要网页开发者提前做好网站的兼容检查和适配.如有问题,可参考文末联系方式,向我们咨询. 背景 WKWebView 是苹果在iO ...

随机推荐

  1. CSS选择器之伪类选择器(伪元素)

    selection [CSS4]应用于文档中被用户高亮的部分(比如使用鼠标或其他选择设备选中的部分).(IE8及以下不支持)(火狐-moz-selection) first-line 选择每个 < ...

  2. 深入浅出React的一些细节——State

    (来源于: https://facebook.github.io/react/docs/state-and-lifecycle.html 翻译by:@TimRChen) Using State Cor ...

  3. logback.xml配置示例

    需要的jar如下: <dependency> <groupId>org.slf4j</groupId> <artifactId>slf4j-api< ...

  4. C++虚函数原理

    类中的成员函数分为静态成员函数和非静态成员函数,而非静态成员函数又分为普通函数和虚函数. Q: 为什么使用虚函数 A: 使用虚函数,我们可以获得良好的可扩展性.在一个设计比较好的面向对象程序中,大多数 ...

  5. 全局唯一ID生成器

    分布式环境中,如何保证生成的id是唯一不重复的? twitter,开源出了一个snowflake算法,现在很多企业都按照该算法作为参照,实现了自己的一套id生成器. 该算法的主要思路为: 刚好64位的 ...

  6. mysql性能优化-慢查询分析、优化索引和配置 (慢查询日志,explain,profile)

    mysql性能优化-慢查询分析.优化索引和配置 (慢查询日志,explain,profile) 一.优化概述 二.查询与索引优化分析 1性能瓶颈定位 Show命令 慢查询日志 explain分析查询 ...

  7. Flask 参数简介

    我们都知道学习了Flask的时候它里面的参数是有很多种的参数  都是需要相互进行调用传递的  今天就简要分析一些常见的参数 首先导入Flask之后看 源码 from flask import Flas ...

  8. Flask配置文件和 路由系统

    debug = True开启debug模式 当你的代码在界面增减之后不用刷新界面自动更新 app.logger.error("这是error模式") app.logger.info ...

  9. [翻译] OCMaskedTextField

    OCMaskedTextField https://github.com/OmerCora/OCMaskedTextField Simple class to display dynamically ...

  10. 浅析NSTextContainer

    浅析NSTextContainer TextKit中的NSTextContainer有点晦涩难懂,如果想用TextKit实现文本分页的效果,你是必须要使用NSTextContainer的...... ...