一、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 Sources和Copy 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. 动作之CCActionInterval(持续动作)家族

    持续动作,顾名思义,就是该动作的执行将持续一段时间.因此持续动作的静态生成函数,往往附带一个时间值Duration. 持续动作类名后缀:一般有两种后缀,一种是To,一种是By.To表示最终达到的目标值 ...

  2. List IEnumerable

    //按部门汇总            IEnumerable<WeekReportWithDepartmentInfo> report = summary            .Grou ...

  3. C++面试题算法

    #include <iostream> #include <string> using namespace std ; /* 题目:给一个字符串.例如 "ababc& ...

  4. Eclipse启动Tomcat访问不了首页

    Eclipse开发web项目与myEclipse不同: 启动服务器后访问 http:localhost:8080 找不到服务器 想要访问Tomcat首页只需修改Tomcat配置 进入Eclipse双击 ...

  5. git设计哲学

    刚开始使用git的时候,总想拿git来和cvs或者svn来作对比,但不久后发现这个想法本身就是错的,git完全就是另外一种物种,一种本属于未来的物种.它的对象存储方式,快照,分支等,都是完全不同的. ...

  6. javascript的一点误解

    var a=[]; for(var i = 0; i < 10; i++) { a[i] = function() { return i; } } console.log(a[9]()); co ...

  7. Java并发——线程池Executor框架

    线程池 无限制的创建线程 若采用"为每个任务分配一个线程"的方式会存在一些缺陷,尤其是当需要创建大量线程时: 线程生命周期的开销非常高 资源消耗 稳定性 引入线程池 任务是一组逻辑 ...

  8. Double跟double

    Double 是类 double是基础数据类型.Double类型是double的包装类,在JDK1.5以后,二者可以直接相互赋值,称为自动拆箱和自动装箱.看你的提示,我推测你的jdk版本在1.5以前. ...

  9. 使用普通Windows服务创建Quartz.Net服务项目

    Quartz.NET 项目地址 http://quartznet.sourceforge.net/ 源码下载地址:Quartz.Net.2.0 首先创建Quartz.Net.2.0解决方案,添加 Wi ...

  10. C#测量程序运行时间及cpu使用时间

    转载:http://www.cnblogs.com/yanpeng/archive/2008/10/15/1943369.html 对一个服务器程序想统计每秒可以处理多少数据包,要如何做?答案是用处理 ...