Insertar CSS en HTML cargado en UIWebView / WKWebView

Soy capaz de get contenido HTML y mostrarlo en mi UIWebView.

Pero desea personalizar el contenido agregando un file CSS externo. Solo puedo cambiar el tamaño del text y la fuente. Probé todas las posibles soluciones para hacer cambios, pero no funciona, no muestra cambios.

A continuación se muestra mi código

HTMLNode* body = [parser body]; HTMLNode* mainContentNode = [body findChildWithAttribute:@"id" matchingName:@"main_content" allowPartial:NO]; NSString *pageContent = [NSString stringWithFormat:@"%@%@", cssString, contentHtml]; [webView loadHTMLString:pageContent baseURL:[NSURL URLWithString:@"http://www.example.org"]]; -(void)webViewDidFinishLoad:(UIWebView *)webView1{ int fontSize = 50; NSString *font = [[NSString alloc] initWithFormat:@"document.getElementsByTagName('body')[0].style.webkitTextSizeAdjust= '%d%%'", fontSize]; NSString *fontString = [[NSString alloc] initWithFormat:@"document.getElementById('body').style.fontFamily=\"helvetica\""]; [webView1 stringByEvaluatingJavaScriptFromString:fontString]; [webView1 stringByEvaluatingJavaScriptFromString:font]; } 

Por favor, ayúdame a get la hoja de styles css en mi opinión.

Puedes hacerlo así:

 - (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 } 

Lo que hace este código:

// 1: define una cadena que contiene todas las declaraciones CSS

// 2: define una cadena de JavaScript que crea un nuevo elemento <style> HTML <style> HTML DOM e inserta las declaraciones CSS en él. En realidad, la inserción se realiza en el siguiente paso, ahora mismo solo hay el marcador de position %@ . Hice esto para evitar que la línea se volviera demasiado larga, pero los pasos 2 y 3 se podrían hacer juntos.

// 3: combina las 2 cadenas

// 4: ejecutar el javascript en el UIWebView

Para que esto funcione, su HTML debe tener un elemento <head></head> .

EDITAR:

También puede cargar la cadena css desde un file css local (denominado "styles.css" en este caso). Simplemente reemplace el paso // 1 con lo siguiente:

 NSString *path = [[NSBundle mainBundle] pathForResource:@"styles" ofType:@"css"]; NSString *cssString = [NSString stringWithContentsOfFile:path encoding:NSUTF8StringEncoding error:nil]; 

Como otra opción, puede simplemente insert un elemento <link> en el <head> que carga el file CSS:

 - (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]; } 

Esta solución funciona mejor para files CSS grandes. Desafortunadamente, no funciona con files HTML remotos. Solo puede usar esto cuando desee insert CSS en HTML que haya descargado a su aplicación.

ACTUALIZACIÓN: WKWebView / Swift 3.x

Cuando está trabajando con un WKWebView inyección de un elemento <link> no funciona debido a la configuration de security de WKWebView .

Aún puedes inyectar el CSS como una cadena. Cree la cadena CSS en su código //1 o póngala en un file local //2 . Solo tenga en count que con WKWebView tiene que hacer la inyección en el 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) }