点击选项卡后页面标题切换的实现

初始化

<header class="mui-bar mui-bar-nav own-main-background-color"><h1 id="nav-title" class="mui-title">首页</h1></header>navtitle = document.getElementById('nav-title');

监听到选项卡点击事件后
1. 更换标题方法一：

var tabitem = this;navtitle.innerText = tabitem.children[tabitem.children.length - 1].innerText;

2. 更换标题方法二：

navtitle.innerHTML = this.querySelector('.mui-tab-label').innerHTML;

3. 如果要更换的标题和选项卡文字不一致，可采用如下代码：

switch (this.querySelector('.mui-tab-label').innerHTML){case "车号":navtitle.innerHTML ="车号查询";break;case "计划号":navtitle.innerHTML ="计划号查询";break;case "我的":navtitle.innerHTML ="我的";break;}