コミュ障だから明日が僕らをよんだって返事もろくにしなかった

何かを創る人に憧れたからブログをはじめたんだと思うよ

月曜日がくるからjQueryを使って月曜日ボタンでも作ろうと思う

新しい朝が来た希望は...ない......

毎度月曜日が来るたびにこんなことをやっている場合でもないのだが、現実から目を背けたいがためにこんなくだらないものを作ってしまう。ボタンを押すと月曜日だけが生き残るボタンを作ったよ。

そういえば、jQuery触るのここだとはじめてかもしれない。

jQuery
ウェブブラウザ用のJavaScriptコードをより容易に記述できるようにするために設計された軽量なJavaScriptライブラリ。
wikipediaより

使い方がよくわからなくても、最初に書くべきこのおまじないさえ覚えていれば、後からいくらでもベタベタとコードを貼り付けるだけでできるからjQuery便利(危険思想)。

$(function(){
  // 処理の記述
});
ボタン作った

  • 日曜日
  • 月曜日
  • 火曜日
  • 水曜日
  • 木曜日
  • 金曜日
  • 土曜日

以下、ソース。

<ul>
 <li class="byebye">日曜日</li>
 <li>月曜日</li>
 <li class="byebye">火曜日</li>
 <li class="byebye">水曜日</li>
 <li class="byebye">木曜日</li>
 <li class="byebye">金曜日</li>
 <li class="byebye">土曜日</li>
</ul>
<button>ボタンを押してね</button>
<script>
$("button").click(function () {
  $(".byebye").hide("slow");
});
</script>

・雑な解説
[buttonタグ]をクリックした時(.click)に処理する(function(){})内容は、[クラス:byabye]を非表示にする(hide())。
以上が[scriptタグ]での処理の流れだよ。英文法の覚え方みたいだね。


勉強も兼ねて手っ取り早く要素を出したり消したりしたい時にはここが一番参考になる気がする。いまとなってはこの範囲だったらCSSで代用できる気がするけど。
Effects - jQuery 日本語リファレンス