基于iOS实现与JavaScript交互

前段时间刚开发了一款基于WebKit的代理浏览器，除了实现了浏览网页功能外，还添加了Socks代理功能（主要实现免流量、流量转发、恶意网址检测等）
iOS只提供了一个接口来与JavaScript交互，即：

- (nullable NSString *)stringByEvaluatingJavaScriptFromString:(NSString *)script

好，下面举例说明，在JavaScript中，如果某一个控件有Name，那么获取这个控件的代码如下：

document.getElementByTagName("controlName")

那么，在iOS中，使用stringByEvaluatingJavaScriptFromString:的方法为：（假如我们更换控件的背景颜色）

[self.webView stringBYEvaluatingJavaScriptFromString:
@"var control = document.getElementsByTagName("controlName");
control.style.background = '#080A3B';
"
]

同理，假设我们想修改html页面上所有的图片时，可以使用以下方法，前提是html页面没有使用懒加载

[self.webView stringByEvaluatingJavaScriptFromString:
@"var i, a;"
"for(i = 0; (a = document.getElementsByTagName('img')[i]); i ++) {"
"a.src = 'picture.png';"     // 替换图片名字
"}"
]

下面列举一些常用的代语句，获取当前title

NSString *title = [self.webView stringByEvaluatingJavaScriptFromString:@"document.title"]

获取页面body

NSString *bodyStr = [self.webView stringByEvaluatingJavaScriptFromString:@"document.inner.body"]

获取当前页面的URL

NSString *urlStr = [self.webView stringByEvaluatingJavaScriptFromString:@"document.location.href"]       // 注意此处获取的url可能是域名

修改界面元素的值

document.getElementsByName('controlName')[0].value = 'other value'  

提交表单

document.forms[0].submit()

如果想插入js代码到heml页面，方法如下：

[self.webView stringByEvaluatingJavaScriptFromString:
@"var script = document.createElement('aScript');"
"script.type = 'text/javascript';"
"script.text = \function newFunction() {"
"var temp = document.getElementsByName('controlName')[0]; "
"temp.value = 'Visitor';"
"document.forms[0].submit();"
"} \";"
"document.getElementsByTagName(head)[0].appendChild(script);"
];
[self.webView stringByEvaluatingJavaScriptFromString:@"newFunction();"];

一般来说，浏览器都有夜间/日间模式功能，像UC、QQ等浏览器的夜间/日间模式完全修改了html页面的控件的背景颜色；

在测试UC浏览器的时候，发现更换夜间、日间模式并没有刷新页面（也就是说，后台并没有准备夜间、日间两个不同样式的html，只是客户端研发人员在通过stringByEvaluatingJavaScriptFromString:修改html页面的css），研究之后发现，UC浏览器已经把html页面缓存到了本地，包括js、css和picture，在设置界面可以看到，完全缓存一个html页面一般需要3MB空间（一般的网页eg：sina、sohu），所以在更换夜间/日间模式的时候，并不用去重新请求网络，达到了很好的用户体验效果。

但是对于其他的像极速浏览器等的，只是调整了屏幕亮度而已，可见，一家公司的实力是可以从开发人员的水平体现出来的。

我在开发浏览器的时候，关于夜间/日间模式这一块也费了不少心思，找到一种办法，虽然方法比较笨重，大量的遍历可能会对手机内存有一定的消耗，测试后发现，效率还行（iPhone 6测试），下面，附上代码：

- (void)setNightMode:(UIWebView *)webView {
    [webView stringByEvaluatingJavaScriptFromString:@"document.getElementsByTagName('body')[0].style.webkitTextFillColor= '#2D99BC'"];
    
    NSString *javaScriptPath = [[NSBundle mainBundle] pathForResource:@"JavaScript" ofType:@"plist"];
    NSDictionary *javaDict = [NSDictionary dictionaryWithContentsOfFile:javaScriptPath];
    NSArray *array = javaDict[@"controls"];
    for(NSString *control in array) {
        [webView stringByEvaluatingJavaScriptFromString:[NSString stringWithFormat:@"var i, a;"
                                                         "for(i = 0; (a = document.getElementsByTagName('%@')[i]); i ++) {"
                                                         "a.style.background = '#080A3B';"
                                                         "}", control]];
    }
}

上面的代码及plist文件，可以在我的GitHub上下载

未经允许，禁止转载