イメージと各イメージを変更するJavaScriptボタンを作成する方法URLとアクティブボタンへのリンクはハイライトカラーです

Question

表示されている例を使用して、hereまたは以下のコードは、ボタンが画像を切り替えるためにどのように使用できるかを示しますオフボタンは暗い電球イメージを表示します）。

しかし、画像（ボタンではない）が選択されている場合は、別のURLウェブページにリンクするために各画像が必要です。

ボタンは画像の変更を制御し、クリックすると各画像は別のURLにリンクします。

アクティブなボタンの色合いを作成する方法もあります。

私は同じページ上の複数のボタンと画像のグループに対してこのスクリプトを繰り返し使用したいと思います。私は他のスクリプトのアイディアにもオープンしています。あなたはアンカータグで画像をラップして、src属性は、IMGで更新される方法と同様に、href属性を更新することができます

<button onclick="document.getElementById('myImage').src='http://www.w3schools.com/js/pic_bulbon.gif'">Turn on the light</button> 
<img id="myImage" src="http://www.w3schools.com/js/pic_bulbon.gif" style="width:100px"> 
<button onclick="document.getElementById('myImage').src='http://www.w3schools.com/js/pic_bulboff.gif'">Turn off the light</button> 

Answer 1

：

以下のサンプルスクリプトは、Javascriptを、HTMLページの本文内に配置されています要素。

<button onclick="document.getElementById('myImage').src='http://www.w3schools.com/js/pic_bulboff.gif';document.getElementById('myLink').href='http://www.google.com'">Turn on the light</button> 
 

 
<a id="myLink" href="http://www.google.com"> 
 
<img id="myImage" src="http://www.w3schools.com/js/pic_bulboff.gif" style="width:100px"> 
 
</a> 
 
<button onclick="document.getElementById('myImage').src='http://www.w3schools.com/js/pic_bulbon.gif';document.getElementById('myLink').href='http://www.yahoo.com'">Turn off the light</button>