どうもジャングルオーシャンのミケです。
今日は簡単なJavascriptの勉強をしていこうと思うよ！
HTMLを勉強した人ならわかると思うけど
どこか他のページにリンクをする時ってaタグを使うよね
今回はaタグを使っていろんな動きでリンクさせる方法を書いていくよ
とりあえず難しい言葉は抜きにして見ていこう！
まずは普通にaタグにhref属性をつけてリンクする場合は
|
1 |
<a href=“http://www.jungleocean.com/”>トップページに飛ぶ</a> |
これはそのままaタグにhref属性を追加してリンクさせた状態
クリックしたらリンクに飛ぶよね
次にあえて違う書き方でリンクをさせた場合
|
1 |
<a href="#" onclick="location.href='http://www.jungleocean.com/';">トップページに飛ぶ</a> |
hrefにURLを入れずにクリックしたときにトップページにリンクさせる書き方だよ
これもクリックをしたらリンクに飛ぶよ
ダブルクリックした時にリンク先に飛ぶようにする書き方
|
1 |
<a href="#" ondbclick="location.href='http://www.jungleocean.com/';">トップページに飛ぶ</a> |
ダブルクリックをしないとリンク先に飛べないようになってるよ
マウスポインタを乗せた時にリンク先に飛ぶようにする書き方
|
1 |
<a href="#" onmouseover="location.href='http://www.jungleocean.com/';">トップページに飛ぶ</a> |
マウスポインタをテキストに被らせるとリンク先に飛ぶよ
マウスポインタをはずした時にリンク先に飛ぶようにする書き方
|
1 |
<a href="#" onmouseout="location.href='http://www.jungleocean.com/';">トップページに飛ぶ</a> |
マウスポインタをテキストに被らせてから離すとリンク先に飛ぶよ
記述内容を見てわかったと思うんだけど
「href」のあとに書いてある「onclick」の箇所を変更しただけなんだ
これらはイベントハンドラって言う処理の書き方だよ
そのイベントハンドラの中にいれてあるのがJavascriptの記述で
locationにhrefの中のURLをいれてくれっていう命令をしていることになるんだ
ちなみにlocationはロケーションバーのことで
ブラウザの上部にあるURLが書いてある箇所のことで
hrefはHypertext Referenceの略だよ
こういうJavascriptの勉強をしていると
イベントハンドラとかオブジェクトとかプロパティとか難しいカタカナがよく出てくるから
もうわけわからん！って拒否反応でちゃう人もいると思うんだけど
実際に記述だけ見てみるとそんなに難しいものではないよね
まずは簡単なものから徐々にステップアップしていこう！！
それじゃまた今度ね！
