去掉webview自带导航栏 使用系统导航栏

本文介绍如何在iOS应用中去除WebView自带的导航栏,使用系统导航栏并实现返回功能。通过设置导航项和监听网页加载事件,实现在网页可以返回时调用WebView的goBack方法,反之则控制器返回。同时,展示了在网页加载完成后如何通过JavaScript移除页面的header标签,以达到更好的用户体验。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

有这样一个页面 加载了一个网页 网页自带导航栏  这时会与系统导航栏重复 这里简单地进行处理 去掉网页的导航栏 使用系统自带的导航栏实现返回功能 标题的显示




- (void)viewDidLoad {

    [superviewDidLoad];

    /// 隐藏系统返回按钮 进行自定义

    self.navigationItem.hidesBackButton = YES;

    self.navigationItem.leftBarButtonItem = [[UIBarButtonItemalloc]initWithImage:[UIImageimageNamed:@"backicon"]style:UIBarButtonItemStylePlaintarget:selfaction:@selector(backacrion)];

    [selfsetupView];

}


- (void)setupView {

    /// 添加加载菊花

    self.hud = [MBProgressHUDshowHUDAddedTo:self.navigationController.viewanimated:YES];

    self.hud.label.textColor = fontColor;

    self.hud.label.font = [UIFont systemFontOfSize:15];

    self.hud.mode = MBProgressHUDModeIndeterminate;

    //创建webview

    _webView = [[UIWebViewalloc]initWithFrame:CGRectMake(0,0,appWidth,appHeight -64)];

    [_webViewloadRequest:[NSURLRequestrequestWithURL:[NSURLURLWithString:self.url]]];

    _webView.delegate =self;

    [self.viewaddSubview:_webView];

}


- (void)backacrion{

    if ([self.webViewcanGoBack]) {

        /// 网页可以返回 就进行网页返回

        [self.webViewgoBack];

    }else{

        [self.viewresignFirstResponder]; 

         /// 网页返回到首页了 返回不了了 这时候我们的控制器返回

        [self.navigationControllerpopViewControllerAnimated:YES];

    }

}

- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType{

    

    self.hud.hidden =NO;

    self.webView.hidden =YES;

    returnYES;

}

在网页加载结束的时候获取头标签进行去除操作

使用谷歌浏览器的开发者工具查看网页源代码 寻找头标签


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

    

    // 1.获取页面标题

    NSString *string =@"document.title";

    //获取当前页面的title 设置导航栏标题

    NSString * title = [webViewstringByEvaluatingJavaScriptFromString:@"document.title"];

    self.title = title;

    [webView stringByEvaluatingJavaScriptFromString:string];

    // 2.去掉页面标题

    NSMutableString *str = [NSMutableStringstring];

    // 3.根据标签类型获取指定标签的元素

    [str appendString:@"var header = document.getElementsByTagName(\"header\")[0];"];

    [str appendString:@"header.parentNode.removeChild(header);"];//移除头部的导航栏

    [webView stringByEvaluatingJavaScriptFromString:str];

    [selfperformSelector:@selector(hidenaction)withObject:selfafterDelay:0.1];

    

}

- (void)hidenaction{

/// 开始加载时隐藏webview 加载完后显示,原因是 因为我们要去掉头标签,,去掉的方法是在网页加载完毕进行的,,添加一个延时现实的方法 可以隐藏掉网页先显示头标签又被移除的过程。使其看起来更自然一些

   self.webView.hidden =NO;

   self.hud.hidden =YES;

}

完成效果


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值