предупредит innerHTML из <a> тегов

Question

у меня есть код сценария Java, как показано ниже, предполагается изменить цвет «а» метки и

предупреждение их внутренний HTML:

function change(n){ 
    for(i=1;i<=6;i++){ 
     document.getElementById('nav_'+i).style.color='#666666';} 
     document.getElementById('nav_'+n).style.color='#FEA563'; 
     var p=document.getElementById('nave_'+n).innerHTML; 
     alert(p); 
    } 
} 

HTML, идет следующим образом. Но предупреждение не работает.

<div id="container"> 
    <div id="top_nav"> 
    <a id="nav_1" onclick="change(1);" href="#">aaaa</a> | 
    <a id="nav_2" onclick="change(2);"href="#">bbbb</a> | 
    <a id="nav_3" onclick="change(3);"href="#">ccccc</a> | 
    <a id="nav_4" onclick="change(4);"href="#">ddddd</a> | 
    <a id="nav_5" onclick="change(5);"href="#">eeeee</a> | 
    <a id="nav_6" onclick="change(6);"href="#">fffff</a> 
    </div> 

Как я могу получить доступ к innerHTML тега «a», который я нажимаю на него?

Answer 1

Более простым решением было бы сделать следующее:

function change(elem) { 
 
    var a = document.getElementById('top_nav').children 
 
    for (var i = 0; i < a.length; i++) { 
 
     a[i].style.color = '#666666'; 
 
    } 
 
    elem.style.color = '#FEA563'; 
 
    alert(elem.innerHTML); 
 
}

<div id="container"> 
 
    <div id="top_nav"> 
 
     <a id="nav_1" onclick="change(this)" href="#">aaaa</a> | 
 
     <a id="nav_2" onclick="change(this)" href="#">bbbb</a> | 
 
     <a id="nav_3" onclick="change(this)" href="#">ccccc</a> | 
 
     <a id="nav_4" onclick="change(this)" href="#">ddddd</a> | 
 
     <a id="nav_5" onclick="change(this)" href="#">eeeee</a> | 
 
     <a id="nav_6" onclick="change(this)" href="#">fffff</a> 
 
    </div> 
 
</div>

Передача this в обработчик событий onclick делает его осознает элемент, который щелкнули. И поскольку все ваши элементы a сгруппированы внутри top_navdiv, вы можете просто пропустить все его дети, чтобы изменить их цвет.

Вот рабочий Скрипт http://jsfiddle.net/JohnnyEstilles/m1960yyL/.