iOS webView載入本地html 呼叫 js,css (基本使用)
阿新 • • 發佈:2019-01-02
首先載入本地的html檔案:
NSURL *baseURL = [NSURL fileURLWithPath:[[NSBundle mainBundle] bundlePath]]; NSString *path = [[NSBundle mainBundle] pathForResource:@"post.dark" ofType:@"html"]; NSString *html = [NSString stringWithContentsOfFile:path encoding:NSUTF8StringEncoding error:nil]; [_javaWebView loadHTMLString:html baseURL:baseURL];
然後呼叫webView的dai裡方法:
- (void)webViewDidFinishLoad:(UIWebView *)webView
[webView stringByEvaluatingJavaScriptFromString:JSstringAction];
可以用這個方法向js檔案進行傳值,呼叫js方法,給js方法設定引數:
例項應用:
html:
<!DOCTYPE HTML> <html> <head> <title></title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no" /> <link rel="stylesheet" href="app.light.css" type="text/css"></link> <script src="zepto.min.js" type="text/javascript"></script> <script src="app.js" type="text/javascript"></script> </head> <body> <div id="title"> <!-- 四色叢林迷彩減肥睡?--> </div> <div id="author_avatar"> <!-- <p><img src="http://bbs.junpinzhi.com/uc_server/avatar.php?size=middle&uid=13931"/> 軍品志</p>--> </div> <div id="page_header"></div> <div id="content"> //傳入內容 </div> <div id="page_footer"></div> <div id="page_bottom"></div> </body> </html>
js部分 :
function initBody1(para) {
var pageContent = $("#content");
pageContent.html(para);
pageContent.css('font-size','100% ');
}
function initBody2(para) {
var pageContent = $("#content");
pageContent.html(para);
pageContent.css('font-size','120% ');
}
css:部分
#content { color: #1a1a1a; font-size: 100%; margin: 0 1em; line-height: 150%; letter-spacing: 50%; word-wrap: break-word; word-break:normal; /* white-space: pre-wrap;*/ text-align:justify; } #content p { margin: 1em auto; } #content img { /* keep aspect ratio, use max width */ max-width:100%; height:auto; /* center image */ margin:1em auto; display: block; } #content .img_desc { color:#888888; font-size:75%; line-height:120%; margin-bottom:0.4em; }
可以對css的"#content"做修改 達到想要的效果
我們通過
[webView stringByEvaluatingJavaScriptFromString:[NSString stringWithFormat:@"initBody2('%@')",self.titleStr]];
向js檔案傳送content 在傳到html 在掉用css進行改變.
t#content {
color: #1a1a1a;
font-size: 100%;
margin: 0 1em;
line-height: 150%;
letter-spacing: 50%;
word-wrap: break-word;
word-break:normal;
/* white-space: pre-wrap;*/
text-align:justify;
}
#content p {
margin: 1em auto;
}
#content img {
/* keep aspect ratio, use max width */
max-width:100%;
height:auto;
/* center image */
margin:1em auto;
display: block;
}
#content .img_desc {
color:#888888;
font-size:75%;
line-height:120%;
margin-bottom:0.4em;
}