获取currenttab的名称并使用该文本替换标题文本

时间:2017-02-20 03:11:10

标签: javascript

我有一些标签的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>

1 个答案:

答案 0 :(得分: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;
}