選択した色に色付けできません<a>タグ

Question

私は完全なJavaScriptメニューを作成しています。

ユーザーのoffsetTopに応じて、<li>または<a>という項目の色を変更しようとしています。理解できないかどうか私に尋ねてください。

メニュー

var menu = document.getElementById('header'); 
var work = document.getElementById('work'); 
var who = document.getElementById('who'); 
var contact = document.getElementById('contact'); 
var offsetWork = work.offsetTop - 60; 
var offsetWho = who.offsetTop - 60; 
var offsetContact = contact.offsetTop - 60; 
var ul = document.getElementsByTagName('ul')[0]; 
var li = ul.getElementsByTagName('li'); 

setInterval(function(){ 
    var ul = document.getElementsByTagName('ul')[0]; 
    var li = ul.getElementsByTagName('li'); 

    if(getCurrPos() >= offsetWork){ 
     menu.style.display = "block"; 
    }else if(getCurrPos() <= offsetWork){ 
     menu.style.display = "none"; 
    } 

    if(offsetWork <= getCurrPos() <= offsetWho){ 
     li[1].style.backgroundColor = '#00a9c6'; 
     //li[1].getElementsByTagName('a').style.color = '#fff'; 
    }else { 
     li[1].style.backgroundColor = '#fff'; 
    } 

    if(offsetWho <= getCurrPos() <= offsetContact){ 
     li[2].style.backgroundColor = '#00a9c6'; 
     //li[2].getElementsByTagName('a').style.color = '#fff'; 
    }else { 
     li[2].style.backgroundColor = '#fff'; 
    } 

    if(getCurrPos() >= offsetContact){ 
     li[3].style.backgroundColor = '#00a9c6'; 
     //li[3].getElementsByTagName('a').style.color = '#fff'; 
    }else { 
     li[3].style.backgroundColor = '#fff'; 
    } 

}, 100); 

すべてのコメント行がない作品を行い、私にはわからない、なぜ李を行うときは、[A]の項目を見つけているため、[1] .getElementsByTagName（「A」） ;

ありがとう、

Maël。セレクタ

によって選択されたすべての要素があなたのような構文で要素にアクセスすることができない、したがって、セレクタに一致するすべての要素のコレクションを返すgetElementsByTagNameの内の最初の要素を返すquerySelector

Answer 1

使用

li[3].querySelector('a').style.color = '#fff'; 

[2] .getElementsByTagName（ 'A'）style.color リチウム