一、WebView加载HTML

UIWebView提供了三个方法来加载html资源

1. loadHTMLString:baseURL: 把html文件的内容以字符串的形式加载到webView里面,然后解析。编码为UTF8

1
2
3
NSString *filePath = [[NSBundle mainBundle] pathForResource:@"index" ofType:@"html"];
NSURL *baseURL = [[NSBundle mainBundle] bundleURL];
[self.webView loadHTMLString:[NSString stringWithContentsOfFile:filePath encoding:NSUTF8StringEncoding error:nil] baseURL:baseURL];

2. loadData:MIMEType:textEncodingName:baseURL: 把html文件的内容以二进制的形式加载到webView里面,然后解析。MIMETYPE指定html文件的格式为"text/html",编码为UTF8

1
2
3
4
NSString *filePath = [[NSBundle mainBundle] pathForResource:@"index" ofType:@"html"];
NSURL *baseURL = [[NSBundle mainBundle] bundleURL];
NSData *data = [NSData dataWithContentsOfFile:filePath];
[self.webView loadData:data MIMEType:@"text/html" textEncodingName:@"UTF-8" baseURL:baseURL];

3. loadRequest:构造一个请求,webView以请求的形式加载本地html文件,然后解析。这种方式可以直接加载网络html

1
2
3
4
NSString *filePath = [[NSBundle mainBundle] pathForResource:@"index" ofType:@"html"];
NSURL *url = [NSURL fileURLWithPath:filePath];
NSURLRequest *request = [NSURLRequest requestWithURL:url];
[self.webView loadRequest:request];

二、WebView加载image,css,js

1. 上面加载html方式中的前两种都指定了一个baseURL,那么这个baseURL是干什么的?

iOS程序在运行的时候会把程序用到的资源文件copy到Bundle中,baseURL指定的目录就是Bundle的根目录

所以image,css,js资源,不管在项目里面放在哪个目录结构下,在HTML内引用的时候,都是直接根目录的

书写资源路径的时候,按照相对路径来理解,html和image,css,js可以看做是在同一个目录下

2. Xcode之前版本可能会把css,js文件当做编译资源而不是Bundle资源,这时可能会出现css,js没有效果

我们在Xcode中Build Phases下可以看到资源文件的存放位置,跟本次内容关联最大的有两项:Compile SourcesCopy Bundle Resources

查看确保资源位置放置正确即可修复这类问题

参考资料(戳这里):

>  http://www.shuizhongyueming.com/2014/01/06/load-local-image-js-css-file-to-webview-in-xcode/

感谢分享

OC与JS交互前言-b的更多相关文章

  1. OC与JS交互前言

    OC与JS交互过程中,可能会需要使用本地image资源及html,css,js文件,这些资源应该如何被加载? 一.WebView加载HTML UIWebView提供了三个方法来加载html资源 1.  ...

  2. OC和JS交互的三种方法

    看简书上说一共有六种OC和JS交互的方法,但是前三种原理都一致,都是通过检测.拦截Url地址实现互相调用的.剩下的react native等第三方框架原理不一样,也没有去研究,下边记录我使用的三种方法 ...

  3. Mac Webview OC与JS交互实现

    1.首先,需要定义一个JS可识别的变量(如external)用于OC与JS交互 - (void)webView:(WebView *)sender didClearWindowObject:(WebS ...

  4. iOS(UIWebView 和WKWebView)OC与JS交互 之二

    在iOS应用的开发过程中,我们经常会使用到WebView,当我们对WebView进行操作的时候,有时会需要进行源生的操作.那么我记下来就与大家分享一下OC与JS交互. 首先先说第一种方法,并没有牵扯O ...

  5. OC与JS交互之WebViewJavascriptBridge

    上一篇文章介绍了通过UIWebView实现了OC与JS交互的可能性及实现的原理,并且简单的实现了一个小的示例DEMO,当然也有一部分遗留问题,使用原生实现过程比较繁琐,代码难以维护.这篇文章主要介绍下 ...

  6. OC与JS交互之UIWebView

    随着H5的强大,hybrid app已经成为当前互联网的大方向,单纯的native app和web app在某些方面显得就很劣势.关于H5的发展史,这里有一篇文章推荐给大家,今天我们来学习最基础的基于 ...

  7. WebViewJavascriptBridge源码探究--看OC和JS交互过程

    今天把实现OC代码和JS代码交互的第三方库WebViewJavascriptBridge源码看了下,oc调用js方法我们是知道的,系统提供了stringByEvaluatingJavaScriptFr ...

  8. iOS(WKWebView)OC与JS交互 之三

      随着H5功能愈发的强大,没进行过混合开发的小伙们都不好意思说自己能够独立进行iOS的app开发,在iOS7操作系统下,常用的native,js交互框架有easy-js,WebViewJavascr ...

  9. OC与JS交互之WKWebView

    上一篇文章我们使用了JavaScriptCore框架重写了之前的示例,iOS8苹果偏爱HTML5,重构了UIWebVIew,给我们带来了WKWebView,使其性能.稳定性.功能大幅度提升,也更好的支 ...

随机推荐

  1. Linux--------------安装vsftpd

    1.安装vsftpd        yum install -y vsftpd         yum -y install ftp vsftpd    2.安装vsftpd虚拟用户配置依赖包     ...

  2. Spring安全资料整理列表

    Spring 被爆漏洞,允许远程执行代码http://automationqa.com/forum.php?mod=viewthread&tid=2827&fromuid=21 Spr ...

  3. MySQL基本查询语句

    创建一张表 create table user ( id ) not null, name ) not null, birthDate date not null, gender ) not null ...

  4. 【S】【S】【S】一大波前端干货整合(一)

      前端交流站点 大前端       http://www.daqianduan.com/ V2EX       http://www.v2ex.com/ W3cplus    http://www. ...

  5. java Map的遍历

    List下的Map的遍历方法 List<String> Keys =new ArrayList<String>(); ){ ;row<SheetData.size() ; ...

  6. python中关于正则表达式四

    []   用来暗示一个字符串集合, 1.在这个集合中:字符串可以被 独特列出,例如[amk]将会匹配'a','m'或者'k'. 2.字符串的范围可以被暗示通过给两个字符串和分开它们用一个'-':例如[ ...

  7. LiangNa Resum

    LiangNa AnShan Street, YangPu, NY @.com OBJECTIVE: Seeking a position to contribute my skills and ed ...

  8. SQLServer实现split分割字符串到列

    网上已有人实现sqlserver的split函数可将字符串分割成行,但是我们习惯了split返回数组或者列表,因此这里对其做一些改动,最终实现也许不尽如意,但是也能解决一些问题. 先贴上某大牛写的sp ...

  9. 解码一个加密的js文件

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  10. Poj 3259 Wormholes(spfa判负环)

    Wormholes Time Limit: 2000MS Memory Limit: 65536K Total Submissions: 42366 Accepted: 15560 传送门 Descr ...