js 原生JS实现TAB栏切换效果

前言：
 在日常生活中很多时候我们都会碰到tab栏的切换效果，类似于下面的 图一 这种效果事项的办法有很多很多，今天我们来看看其中的一种。

需求分析

1. 点击上面的tab栏 下面的内容跟着改变
2. 点击tab栏以后点击的那个会变颜色，当点击其他的原来点击过的会恢复原本的颜色

代码部分

html部分：

由于要默认显示第一个tab和第一个tab对应的内容，所以这里需要给他设置一个行内属性默认显示
后面的点击操作都是改变行内属性达到显示和隐藏以及变色。

<div class="fa">
        <div class="main-top">
            <div class="bt" style="background-color: skyblue;">table1</div> <!-- 默认显示 -->
            <div class="bt">table2</div>
            <div class="bt">table3</div>
            <div