javascript - 获取当前选项卡的名称并使用该文本替换标题文本

Question

我有一些选项卡的 html。我想获取“currenttab”的文本名称，并使用该文本替换 .tabmenu 范围文本“League Tabs”。我怎样才能用 JavaScript 做到这一点？

<div class="tabmenu"><span>LEAGUE TABS</span><input id="sub100" type="checkbox"><label for="sub100"><span></span></label>
    <ul id="homepagetabs">
        <li id="tab0" onclick="javascript:show_tab('0');" class="currenttab"><a class="no-sub">Main<input id="sub100" type="checkbox"><label for="sub100"></label></a></li>
        <li id="tab1" onclick="javascript:show_tab('1');" class=""><a class="no-sub">#2<input id="sub100" type="checkbox"><label for="sub100"></label></a></li>
        <li id="tab2" onclick="javascript:show_tab('2');" class=""><a class="no-sub">11<input id="sub100" type="checkbox"><label for="sub100"></label></a></li>
        <li id="tab3" onclick="javascript:show_tab('3');" class=""><a class="no-sub">1<input id="sub100" type="checkbox"><label for="sub100"></label></a></li>
        <li id="tab4" onclick="javascript:show_tab('4');" class=""><a class="no-sub">#5<input id="sub100" type="checkbox"><label for="sub100"></label></a></li>
        <li id="tab5" onclick="javascript:show_tab('5');" class=""><a class="no-sub">#6<input id="sub100" type="checkbox"><label for="sub100"></label></a></li>
        <li id="tab6" onclick="javascript:show_tab('6');" class=""><a class="no-sub">#7<input id="sub100" type="checkbox"><label for="sub100"></label></a></li>
        <li id="tab7" onclick="javascript:show_tab('7');" class=""><a class="no-sub">#8<input id="sub100" type="checkbox"><label for="sub100"></label></a></li>
        <li id="tab8" onclick="javascript:show_tab('8');" class=""><a class="no-sub">#9<input id="sub100" type="checkbox"><label for="sub100"></label></a></li>
        <li id="tab9" onclick="javascript:show_tab('9');" class=""><a class="no-sub">#10<input id="sub100" type="checkbox"><label for="sub100"></label></a></li>
    </ul>
</div>

Answer 1

在你的show_tab的某个地方函数，需要获取当前选择的<li>项目，然后抓取其文本并将其复制到选项卡菜单:

var tabmenuSpan = document.querySelector('.tabmenu span');

function show_tab(number) {
  // code to remove/add the currenttab class
  var tabText = document.querySelector('.currenttab a').textContent;
  tabmenuSpan.textContent = tabText;
}