你可以这样做:
- (void)webViewDidFinishLoad:(UIWebView *)webView {
NSString *cssString = @"body { font-family: Helvetica; font-size: 50px }"; // 1
NSString *javascriptString = @"var style = document.createElement('style'); style.innerHTML = '%@'; document.head.appendChild(style)"; // 2
NSString *javascriptWithCSSString = [NSString stringWithFormat:javascriptString, cssString]; // 3
[webView stringByEvaluatingJavaScriptFromString:javascriptWithCSSString]; // 4
}
这段代码的作用:
// 1 : 定义一个包含所有 CSS 声明的字符串
// 2 : 定义一个 javascript 字符串,该字符串创建一个新的<style> HTML DOM 元素并将 CSS 声明插入其中。实际上插入是在下一步中完成的,现在只有%@ 占位符。我这样做是为了防止线路变得太长,但第 2 步和第 3 步可以一起完成。
// 3 : 合并两个字符串
// 4:在UIWebView中执行javascript
为此,您的 HTML 必须有一个 <head></head> 元素。
编辑:
您还可以从本地 css 文件(在本例中名为“styles.css”)加载 css 字符串。只需将步骤 //1 替换为以下内容:
NSString *path = [[NSBundle mainBundle] pathForResource:@"styles" ofType:@"css"];
NSString *cssString = [NSString stringWithContentsOfFile:path encoding:NSUTF8StringEncoding error:nil];
作为另一种选择,您可以将 <link> 元素注入到加载 CSS 文件的 <head>:
- (void)webViewDidFinishLoad:(UIWebView *)webView {
NSString *path = [[NSBundle mainBundle] pathForResource:@"styles" ofType:@"css"];
NSString *javascriptString = @"var link = document.createElement('link'); link.href = '%@'; link.rel = 'stylesheet'; document.head.appendChild(link)";
NSString *javascriptWithPathString = [NSString stringWithFormat:javascriptString, path];
[webView stringByEvaluatingJavaScriptFromString:javascriptWithPathString];
}
此解决方案最适合大型 CSS 文件。不幸的是,它不适用于远程 HTML 文件。仅当您想将 CSS 插入到已下载到应用的 HTML 中时,才能使用此功能。
更新:WKWebView / Swift 3.x
当您使用WKWebView 时,由于WKWebView 的安全设置,注入<link> 元素不起作用。
您仍然可以将 css 作为字符串注入。在您的代码 //1 中创建 CSS 字符串或将其放入本地文件 //2。请注意,使用 WKWebView 您必须在 WKNavigationDelegate 的 webView(_:didFinish:) 方法中进行注入:
func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) {
insertCSSString(into: webView) // 1
// OR
insertContentsOfCSSFile(into: webView) // 2
}
func insertCSSString(into webView: WKWebView) {
let cssString = "body { font-size: 50px; color: #f00 }"
let jsString = "var style = document.createElement('style'); style.innerHTML = '\(cssString)'; document.head.appendChild(style);"
webView.evaluateJavaScript(jsString, completionHandler: nil)
}
func insertContentsOfCSSFile(into webView: WKWebView) {
guard let path = Bundle.main.path(forResource: "styles", ofType: "css") else { return }
let cssString = try! String(contentsOfFile: path).trimmingCharacters(in: .whitespacesAndNewlines)
let jsString = "var style = document.createElement('style'); style.innerHTML = '\(cssString)'; document.head.appendChild(style);"
webView.evaluateJavaScript(jsString, completionHandler: nil)
}