一、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. iOS开发经验总结(下)

    四十.AFNetworking 传送 form-data 将JSON的数据,转化为NSData, 放入Request的body中. 发送到服务器就是form-data格式. 四十一.非空判断注意 BO ...

  2. last_9t's_ramsey

    cannot finish his face

  3. air2调用本地exe的文章

    流传了两种配置app.xml的方法,分别是: <supportedProfiles>extendedDesktop</supportedProfiles>  <suppo ...

  4. Prepare a Nexus Maven private repository

    1. port nat mapping #ssh VBoxManage modifyvm "boot2docker-vm" --natpf1 "tcp-port_5002 ...

  5. mongodb环境部署

    mongodb 环境部署 1.环境说明 安装软件:mongodb-linux-x86_64-.tgz 软件安装位置:/usr/local/mongodb 数据存放位置:/var/mongodb/dat ...

  6. 【转载】NIO服务端序列图

    步骤一:打开ServerSocketChannel,用于监听客户端的连接,它是所有客户端连接的父管道,代码示例如下: ServerSocketChannel acceptorSvr = ServerS ...

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

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

  8. hdoj1325 Is It A Tree?

    Is It A Tree?题目链接 题意: 多组测试数据, 每组数据有多个数对, 表示一条有向边(即第一个数是第二个数的父节点), 以 0,0 为一组测试数据结束标志.当输入-1,-1时测试结束. 从 ...

  9. 利用Merge生成或更新新记录

    -- ============================================= -- Author: <华仔> -- Create date: <2016,6,7& ...

  10. iOS开发——视频播放 待更新……

    本文主要实现调用系统自带的播放器,自带的播放器已经做好了屏幕的适配,集成播放,暂停,快进等功能.能够满足基本的视频播放功能及iOS的视频播放的开发. 最后将其简单的封装成一个iOS视频播放工具类. 一 ...