JavaScript - jQuery Web Page Manipulation: Mod the DOM(addClass method,removeClass method)

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 4(jQuery Web Page Manipulation: Mod the DOM)、EXERCISE(No. 2499)を解いてみる。

その他参考書籍

• Head First HTML and CSS
• Head First JavaScript Programming

EXERCISE(No. 2499)

JavaScript(BBEdit, Emacs)

$(document).ready(function () {
    var v = false,
        $m,
        $f;
    $('button#veg_on').click(function () {
        if (!v) {
            $('.meat').after('<li class="tofu"><em>Tofu</em></li>');
            $m = $('.meat').detach();
            $f = $('.fish').parent().parent().detach();
            $('.tofu').parent().parent().addClass('veg_leaf');
            v = true;
        }
    });
    $('button#restore_me').click(function () {
        if (v) {
            $('.menu_entrees li').first().before($f);
            $('.portobello').replaceWith(
                '<li class="hamburger">Hamburger</li>');
            $('.tofu').each(function (i) {
                $(this).after($m[i]);
            });
            $('.tofu').parent().parent().removeClass('veg_leaf');
            $('.tofu').remove();
            v = false;
        }
    });
});

index2499.html