网易新闻详情页排版实现思路

　　不论是哪一家新闻app的新闻详情页都有大量的图片和片断性的文字，一直很好奇它排版的具体实现方式，构想过一些办法（富文本之类）发现都不是明智的方法，所以决定研究一下。
　　查阅资料得知新闻页面大都是用UIWebView加载html来完成。参考博文网易新闻客户端iOS版本中新闻详情页（UIWebView）技术实现的分析探讨的内容以及作者的demo我也实现了一遍。

涉及的技术点：

　　* html模板引擎的使用，我使用的GRMustache。
　　* JS与OC之间的通信，可以使用WebViewJavascriptBridge。
　　* SDWebImage的使用，这里指的主要是指下载图片，返回已经下载完成的图片在本地的地址。
　　ps:需要一点点html和js语法上的知识，如果不懂我觉得靠google/baidu也是能够搞定的。
　　

效果

　　原谅我偷懒，没有自己去抓数据，是参照网易新闻客户端iOS版本中新闻详情页（UIWebView）技术实现的分析探讨这篇博文里作者抓取的链接来完成demo，我这篇其实就是这个博文的稍微啰嗦一点的版本。我的大部分思路都是来自这篇文章。

主要实现

1.WebViewJavascriptBridge的初始化

- (void)initBridge {
    // 开启日志
    [WebViewJavascriptBridge enableLogging];

    //设置给哪个webView建立js与oc通信的桥梁
    self.bridge = [WebViewJavascriptBridge bridgeForWebView:self.webView];
    //如果需要实现UIWebViewDelegate可以设置代理
    [self.bridge setWebViewDelegate:self];

    //注册 用于js主动调用oc
    [self.bridge registerHandler:@"testObjcCallback" handler:^(id data, WVJBResponseCallback responseCallback) {
        NSLog(@"我是js主动调用oc后的输出");
    }];

    //注册图片点击事件
    __weak typeof(self)weakSelf = self;
    [self.bridge registerHandler:@"tapImage" handler:^(id data, WVJBResponseCallback responseCallback) {
        //点击图片的index
        NSLog(@"=======%@=========", data);
        NSString *index = (NSString *)data;
        //初始化图片浏览器
        [weakSelf browseImages:index.integerValue];
    }];

    //oc主动调用js
    [self.bridge callHandler:@"testJavascriptHandler" data:nil responseCallback:^(id responseData) {
        NSLog(@"我是oc主动调用js后的输出");
    }];
}

　　关于WebViewJavascriptBridge的使用，一开始看着回调的使用可能会有点晕，特别是之前的版本中，调用可以通过send和callHandler两种方法，最近的版本中好像已经只采用callHandler这一种方法来进行调用了，简化了理解。
　　其实简单来说就是一个注册&调用的关系。如果js需要调用oc的代码，那么js是主动方，用callHandler方法，即调用的字面意思。而oc是被调用的一方，需要注册一个方法用于被调用，即用registerHandler方法，反过来oc调用js是一样的。
　　可以通过UIWebView与JS的深度交互这篇文章进行理解。不过最近的版本中已经没有再采用send的方法来调用了。

2.网络请求　　

- (void)httpRequest {
    self.detailID = @"AQ4RPLHG00964LQ9";//多张图片
    NSMutableString *urlStr = [NSMutableString stringWithString:@"http://c.m.163.com/nc/article/xukunhenwuliao/full.html"];
    [urlStr replaceOccurrencesOfString:@"xukunhenwuliao" withString:_detailID options:NSCaseInsensitiveSearch range:[urlStr rangeOfString:@"xukunhenwuliao"]];

    AFHTTPSessionManager *manager = [AFHTTPSessionManager manager];
    __weak typeof(self)weakSelf = self;
    [manager GET:urlStr parameters:nil progress:nil success:^