一 加载外部网页

1、使用UIWebView加载网页
　　运行XCode  新建一个Single View Application 。

2 添加安全消息

　　添加以下消息到项目的  Info.plist

<key>NSAppTransportSecurity</key>

<dict>

<key>NSAllowsArbitraryLoads</key><true/>

</dict>

2、加载WebView
　　在ViewController.m添加WebView成员变量和添加实现

#import "ViewController.h"

@interface ViewController ()

@property (weak, nonatomic) IBOutlet UIWebView *webView;

@end

@implementation ViewController

- (void)viewDidLoad {

    [super viewDidLoad];

    NSURL * url = [ NSURL URLWithString:@"http://www.baidu.com" ] ;

  NSURLRequest *request = [NSURLRequest requestWithURL:url ];

    [self.webView loadRequest:request];

}

@end

二 加载内部资源

　　1 新建一个IOS的应用。加载一个web资源到本地应用。

2 加载的网络页面

index.html

<html>

   <head>

      <meta charset="UTF-8">

   </head>

   <body>

      <p id="word"></p>

      <ul>

          <li class="change">你好</li>

          <li>test1</li>

          <li>test2</li>

          <li>test3</li>

          <li>test4</li>

          <li>test5</li>

      </ul>

   </body>

</html>

3 在ViewController.m添加请求本地资源的代码

#import "ViewController.h"

@interface ViewController ()

@property (weak, nonatomic) IBOutlet UIWebView *webView;

@end

@implementation ViewController

- (void)viewDidLoad {

    [super viewDidLoad];

    NSURL *url = [[NSBundle mainBundle] URLForResource:@"index" withExtension:@"html"];

    NSURLRequest *request = [NSURLRequest requestWithURL:url ];

    [self.webView loadRequest:request];

}

@end

4 设置代理

选中工程里的 Main.storyboard在找到Web View 视图，按住 commond键，指向ViewController在弹出的菜单里选中'delegate',勾选中后，在控制器中点击鼠标右键查看 WebView的delegate设置成功。

5 让 ViewController.m实现 UIWebViewDelegate 代理，重写webViewDidFinishLoad方法


#import "ViewController.h"

@interface ViewController ()<UIWebViewDelegate>
@property (weak, nonatomic) IBOutlet UIWebView *webView;

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
   
    //NSURL * url = [ NSURL URLWithString:@"http://www.baidu.com" ] ;
     NSURL *url = [[NSBundle mainBundle] URLForResource:@"index" withExtension:@"html"];
    
    NSURLRequest *request = [NSURLRequest requestWithURL:url ];
    
    [self.webView loadRequest:request];
    
}

- (void) webViewDidFinishLoad:(UIWebView *)webView{
    // 删除
    NSString *str = @"var p = document.getElementsByTagName('p')[0];";
    NSString *str1 = @"p.remove();";
    
    [webView stringByEvaluatingJavaScriptFromString:str];
    [webView stringByEvaluatingJavaScriptFromString:str1];
    
    // 添加
    NSString *str2 = @"var p = document.createElement('p');"
    "p.innerHTML = 'It is a good day';"
    "p.style.background = 'red';"
    "document.body.appendChild(p);";
    [webView stringByEvaluatingJavaScriptFromString:str2];
    
    // 修改
    NSString *str3 = @"var li = document.getElementsByTagName('li')[0]; li.innerHTML='test6';";
    [webView stringByEvaluatingJavaScriptFromString:str3];
    
    
    NSString * str4 = @"var img = document.createElement('img');"
                    "img.src='img_01.jpg';"
                    "document.body.appendChild(img);";
     [webView stringByEvaluatingJavaScriptFromString:str4];

    
}

@end

最终效果如下图所示：

　　练习访问 http://wap.baidu.com页面，修改页面的内容：

　　关键代码：

- (void)viewDidLoad {

    [super viewDidLoad];

    NSURL * url = [ NSURL URLWithString:@"http://www.baidu.com" ] ;

    NSURLRequest *request = [NSURLRequest requestWithURL:url ];

    [self.webView loadRequest:request];

}

- (void) webViewDidFinishLoad:(UIWebView *)webView{

    NSString *str = @"var ele = document.getElementsByClassName('text-content')[0];"

                    "ele.innerText = '12345678';";

　　[webView stringByEvaluatingJavaScriptFromString:str];

}

知识点：

　　1. 在mac app中，点击 input标签时，如果不能弹出键盘需要按住以下快捷键。

commond + shift + K

　　2. 苹果键盘与Windows键盘完整对应

Windows  Ctrl   ---  Mac Control

Windows  Win --- Mac Option

Windows Alt --- Mac Commond

HTML5学习总结-11 IOS 控件WebView显示网页的更多相关文章

  1. HTML5学习总结-10 Android 控件WebView显示网页

    WebView可以使得网页轻松的内嵌到app里,还可以直接跟js相互调用. webview有两个方法:setWebChromeClient 和 setWebClient 1)setWebClient: ...

  2. Android：控件WebView显示网页

    WebView可以使得网页轻松的内嵌到app里,还可以直接跟js相互调用. webview有两个方法:setWebChromeClient 和 setWebClient setWebClient:主要 ...

  3. Android：控件WebView显示网页 -摘自网络

    WebView可以使得网页轻松的内嵌到app里,还可以直接跟js相互调用. webview有两个方法:setWebChromeClient 和 setWebClient setWebClient:主要 ...

  4. 安卓，网页控件，显示网页 Android, web controls, display web pages

    安卓,网页控件,显示网页Android, web controls, display web pages 作者:韩梦飞沙 Author:han_meng_fei_sha 邮箱:313134555@qq ...

  5. UIKit控件直接显示网页文字内容

    NSString *html = @"<bold>Hello</bold> Now<br> <em>iOS</em> can cr ...

  6. ios学习笔记图片+图片解释（c语言 oc语言 ios控件 ios小项目 ios小功能 swift都有而且笔记完整喔）

    下面是目录其中ios文件夹包括了大部分ios控件的介绍和演示,swift的时完整版,可以学习完swift(这个看的是swift刚出来一周的视频截图,可能有点赶,但是完整),c语言和oc语言的也可以完整 ...

  7. 设计一个 iOS 控件

    转载自:http://blog.csdn.net/zhangao0086/article/details/45622875 代码的等级:可编译.可运行.可测试.可读.可维护.可复用 前言 一个控件从外 ...

  8. iOS控件之UIResponder类

    iOS控件之UIResponder类 在iOS中UIResponder类是专门用来响应用户的操作处理各种事件的,我们知道UIApplication.UIView.UIViewController这几个 ...

  9. 控件WebView网页的加载

    Android:控件WebView网页的加载 WebView可以使得网页轻松的内嵌到app里,还可以直接跟js相互调用. webview有两个方法:setWebChromeClient 和 setWe ...

随机推荐

  1. css的active事件在手机端不生效的解决方法

    对一名前端来说,改页面的过程总是痛苦的,产品经理说要加个点击样式,于是加active的class,本来以为这样就OK了,没想到电脑上ok,本地测也是ok的,tomcat上一跑就没效果了.我甚至把! i ...

  2. 又发现个.net framework的坑

    请找出这两个方法的区别: http://msdn.microsoft.com/en-us/library/ms584187(v=vs.110).aspx

  3. MVC————扩展方法MvcHtmlString

    使用前: public static class MyHtmlHelper { public static string GroupPage(this HtmlHelper helper) { str ...

  4. android 调用电话功能

    今天用到了打电话的功能,这要如何实现呢? 很简单 1.创建对应对的xml展示页面喝java文件 2.在manifest中添加权限 下面上代码吧: 这是布局的一部分 <LinearLayout a ...

  5. wsdl中含ref="s:schema"时处理的

    dos窗口,在生成客户端代码的时候,出现了下图所示的错误: java是通过JAXB解析wsdl文件的,出现这种错误的原因是: 是JAXB目前还不支持ref 这种元素的解析 s:schema是types ...

  6. 模块(modue)的概念：

    在计算机程序的开发过程中,随着程序代码越写越多,在一个文件里代码就会越来越长,越来越不容易维护. 为了编写可维护的代码,我们把很多函数分组,分别放到不同的文件里,这样,每个文件包含的代码就相对较少,很 ...

  7. 基于jquery实现的上传图片及图片预览效果代码

    <!DOCTYPE html> <html> <head> <title>HTML5上传图片预览</title> <meta http ...

  8. 自定义的ViewGroup中添加自定义View 造成的无法显示问题(个人)

    首先说一下我在网上找了很久没有找到说明方法所以我就自己试着写了一下 1.我自定义了一个继承了RelativeLayout的ViewGroup java代码如下: /** * 简单自定义三头像 * @a ...

  9. Spring 在web 容器中的启动过程

    1.对于一个web 应用,其部署在web 容器中,web 容器提供其一个全局的上下文环境,这个上下文就是 ServletContext ,其后面的spring IoC 容器提供宿主环境 2.在web. ...

  10. mysql-拼接字段concat，concat_ws函数

    Mysql的查询结果行字段拼接,可以用下面两个函数实现: 1. concat函数 mysql') from test ; +---------------------+ ') | +--------- ...