JavaScript - jQuery Web Page Manipulation: Mod the DOM(id)

Head First jQuery
(O'Reilly Media)
Ryan Benedetti(著), Ronan Cranley(著)

開発環境

• OS X Yosemite - Apple (OS)
• Safari, Firefox, Google Chrome(Webプラウザ)
• Emacs (CUI)、BBEdit - Bare Bones Software, Inc.(GUI) (Text Editor)
• JavaScript (プログラミング言語)

Head First jQuery(Ryan Benedetti(著)、Ronan Cranley(著)、O'Reilly Media)のChapter 3(jQuery Web Page Manipulation: Mod the DOM)、SHARPEN YOUR PENCIL(No. 2005)を解いてみる。

その他参考書籍

• Head First HTML and CSS
• Head First JavaScript Programming

SHARPEN YOUR PENCIL(No. 2005)

HTML5(BBEdit, Emacs)

index.html

<div class="topper">
  <h2>Our Menu</h2>
  <nav>
    <ul>
      <li class="nav"><button id="veg_on">Go vegetarian</button></li>
      <li class="nav"><button id="restore_me">Restore Menu</button></li>
    </ul>
  </nav>
</div>

JavaScript(BBEdit, Emacs)

my_scripts.js

$(document).ready(function () {
    var v = false;

    $('button#veg_on').click(function () {
        if (!v) {
            v = true;
        }
    });
    $('button#restore_me').click(function () {
        if (v) {
            v = false;
        }
    });
});