2015年3月19日木曜日

開発環境

  • 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 8(jQuery and Ajax: Please Pass the Data)、SHARPEN YOUR PENCIL(No. 4267)を解いてみる。

その他参考書籍

SHARPEN YOUR PENCIL(No. 4267)

JavaScript(BBEdit, Emacs)

$(document).ready(function(){    
    var FREQ = 10000,
        startAJAXcalls = function () {
            setTimeout(function () {
                getXMLRacers();
                startAJAXcalls();
            }, FREQ);
        },

        getTime = function () {
            var a_p = "",
                d = new Date(),
                curr_hour = d.getHours(),
                curr_min,
                curr_sec;

            if (curr_hour < 12) {
                a_p = "AM";
            } else {
                a_p = "PM";
            }
            if (curr_hour === 0) {
                curr_hour = 12;
            } else {
                curr_hour = curr_hour;
            }
            if (curr_hour > 12) {
                curr_hour = curr_hour - 12;
            } else {
                curr_hour = curr_hour;
            }
            
            curr_min = d.getMinutes().toString();
            curr_sec = d.getSeconds().toString();
            
            if (curr_min.length === 1) {
                curr_min = "0" + curr_min;
            }
            if (curr_sec.length === 1) {
                curr_sec = "0" + curr_sec;
            }         
            $('#updatedTime').html(curr_hour + ":" + curr_min + ":" + curr_sec +
                                   " " + a_p );        
        },
        getXMLRacers = function () {
            $.ajax({
                url: 'finishers.xml',
                chache: false,
                dataTye: 'xml',
                success: function (xml) {
                    $('#finishers_m').empty();
                    $('#finishers_f').empty();
                    $('#finishers_all').empty();
                    $(xml).find('runner').each(function () {
                        var info = '<li>Name: ' + $(this).find('fname').text() +
                            $(this).find('lname').text() + '. Time: ' +
                            $(this).find('time').text() + '</li>',
                            gender = $(this).find('gender').text();
                        
                        if (gender === 'm') {
                            $('#finishers_m').append(info);
                        } else if (gender === 'f') {
                            $('#finishers_f').append(info);
                        }
                        $('#finishers_all').append(info);
                    });
                    getTime();
                }    
            });          
        };
    
    getXMLRacers();
    startAJAXcalls();
});

index4267.html

0 コメント:

コメントを投稿