如何主動使用JavaScript

Question

鏈接我有以下鏈接

<ul class="dropdown dropdown-horizontal"> 
     <li><a href="#" class="dir" onClick="clickMe('Wall'); selectedTab('Wall');">Wall</a></li> 
     <li><a href="#" class="dir" onClick="clickMe('Introduction');">Introduction</a></li> 
     <li><a href="#" class="dir" onClick="clickMe('Activities');">Activities</a></li> 
     <li><a href="#" class="dir" onClick="clickMe('Reviews');">Reviews</a></li> 
     <li><a href="#" class="dir" onClick="clickMe('Recommendation');">Recommendation</a></li> 
     <li><a href="#" class="dir" onClick="clickMe('Photos');">Photos</a></li> 
     <li><a href="#" class="dir" onClick="clickMe('Discussion');">Discussion</a></li> 
    </ul> 

，如果我點擊任何鏈接，那麼它一定是高的照明。

Answer 1

嗯：

<a href="#" id='photos' 
onclick="var photos=document.getElementById('photos');photos.style.background='chartreuse';false;"> 
Photos</a> 

Answer 2

我想你想要a:active CSS psuedo選擇器。

Answer 3

最簡單的方法是使用jQuery的

你將不得不像財產以後：

$('.menuItem').click(function() { 
    $('.current').removeClass("curret"); // To remove the highlight from the previous selection 
    $(this).addClass("current") 
}); 

然後在你的CSS，你會宣稱目前你想要的風格。這與css僞選擇器的一個優點是你可以像$（this）.parent（）那樣訪問鏈接的父元素，以防你的菜單是ul。

Answer 4

您不需要JavaScript來做到這一點。一些CSS規則就夠了。

根據你需要，你可以使用一個或所有這些HTML僞選擇的是什麼行爲（：鏈接，：參觀，：懸停，：積極）。

鏈接選擇器指定鏈接在出於任何原因（即其正常狀態）未被點擊或激活時的行爲。

：active僞類爲被激活的元素添加樣式。

如果您需要更具體，例如要突出你鼠標懸停（僅當該鏈接是你的鼠標下的其他詞）把這個在你的HTML的頭部分：

<style type="text/css" media="screen"> 
    a:hover { background: #fbdbe8; color: #F55B99;} 
</style> 

如果你想突出你已經訪問 VS什麼不可以把這個在你的HTML的頭部分：

<style type="text/css" media="screen"> 
    a:visited { background: #fbdbe8; color: #F55B99;} 
</style> 

然後每點擊的鏈接中爲h當您回到頁面時突出顯示。

當然，您可以在外部.css文件中添加樣式規則，而不是將它們放在頭部。