Introduction to JavaScript Programming with XML and PHP

Elizabeth Drake       Elizabeth Drake has over 30 years of experience teaching at all levels of higher education from community college through university in varied disciplines including Computer Science, Physics, Mathematics, and Anthropology. She has been teaching computer science courses, primarily at Santa Fe College in Gainesville, Florida for over eighteen years. She developed the Web Authoring and Web Programming curricula at Santa Fe College and is presently developing a Mobile Application curriculum. She has published texts on Programming Logic and JavaScript through Pearson Education.

• 0:  Computer Basics   1.    A Brief History of Computers a.    What is a Computer? b.    Personal Computers c.    Today's Computers 2.    A Brief History of the Internet a.    Packet switching b.    Transmission Control Protocol and Internet Protocol (TCP/IP) i.    Try it yourself c.    What Is a URL? i.    The protocol ii.    The web server iii.    The domain iv.    The path v.    Is all that necessary? 3.    Computer Basics a.    Input b.    Processing c.    Storage i.    Internal memory ii.    Mass storage devices d.    Output 4.    What is Programming? a.    The History of Programming i.    A brief timeline b.    Types of Software i.    Application software ii.    System software c.    Programming and Scripting Languages i.    Machine language ii.    Assembly language iii.    Comparing machine language and assembly language iv.    High-level languages v.    Writing programs vi.    Scripting languages vs. programming languages 5.    Browsers a.    What Is a Browser? b.    Overview of Major Browsers c.    How Does A Browser Work? d.    Is the World Wide Web the Same As the Internet? e.    What Does This Mean To You? 6.    JavaScript and the Acronyms: XHTML, DOM, PHP, and XML a.    A Brief History of JavaScript b.    Web pages and XHTML c.    Server-Side and Client-Side Technologies d.    JavaScript Overview i.    A dynamic language ii.    First-class functions iii.    A multi-paradigm language iv.    How JavaScript is used e.    Overview of DOM, PHP, and XML i.    The Document Object Model: DOM ii.    PHP Hypertext Preprocessor (or Personal Home Page Tools) iii.    Extensible Markup Language: XML 7.    Keywords 8.    Review Exercises 1: JavaScript Programming Basics 1.    What is Programming? a.    General problem-solving strategy b.    The program development cycle 2.    The Structure of a Program a.    Input-processing-output i.    input ii.    processing iii.    output b.    The control structures i.    Sequence ii.    Selection iii.    Repetition 3.    Primary Data Types and Operations on Data a.    Numerical data b.    String data c.    Boolean data d.    Variables and Named Constants e.    Assignment statements f.    Operations on data i.    Numeric operations ii.    Character and string operations 4.    Problem Solving: The Importance of Logical Thinking a.    Planning a simple program b.    Pseudocode c.    Flowcharts 5.    JavaScript in the Web Page a.    The Tag Pair b.    The Tag Pair c.    JavaScript in a Web Page d.    JavaScript in the document e.    The   Event 6.    Introduction to Objects a.    What is an Object? b.    Properties and Methods c.    The Document object d.    Dot notation e.    The write() method f.    The GetElementById() method g.    The open() and close() methods 7.    Introduction to JavaScript Functions and Events a.    Introduction to Functions i.    Parameters ii.    The prompt() function b.    Introduction to Events i.    Event-driven programming 8.    Putting it to Work a.    A Brief Explanation b.    Greg’s Gambits: Enter the player’s name c.    Carla’s Classroom: Enter the student’s name and age 9.    Keywords 10.    Review Exercises 11.    Programming Challenges a.    On Your Own b.    Case Studies i.    Greg’s Gambits ii.    Carla’s Classroom iii.    Lee's Landscape iv.    Jackie's Jewelry 2:  Building Blocks: Variables and Operators 1.    What is a Variable? a.    Memory locations b.    Variable names c.    Declaring variables 2.    Data Types a.    A loosely typed language b.    Numbers c.    Strings and characters d.    Named constants 3.    Arithmetic Operators and Some Important Functions a.    The modulus operator b.    The hierarchy of operations c.    The concatenation operator d.    Parsing Integers and floating point numbers i.    Using  ParseInt() ii.    Using  ParseFloat() 4.    Relational Operators a.    ASCII code b.    Relational operators 5.    Logical Operators and the Conditional Operator a.    Logical operators b.    Boolean logic and Boolean operators c.    The order of operations for logical operators d.    The conditional operator 6.    Putting it to Work a.    Greg’s Gambits: Creating Your Own Story i.    Developing the program ii.    Writing the code iii.    The CharAt() function b.    Carla’s Classroom: A Spelling Lesson i.    Developing the program ii.    The functions iii.    Finishing up 8.    Keywords 9.    Review Exercises 10.    Programming Challenges a.    On Your Own b.    Case Studies i.    Greg’s Gambits ii.    Carla’s Classroom iii.    Lee's Landscape iv.    Jackie's Jewelry 3:  Making Decisions: the Selection Structure 1.    What if? Types of Selection Structures 2.    The Single Alternative Structure: the if... Clause 3.    The Dual Alternative Structure: the if...else... Clause 4.    Nested Selection Structures 5.    Compound Conditions a.    Combining Relational and Logical Operators i.    Logical operators revisited ii.    a note about syntax iii.    Using ANDs and ORs 6.    The Multiple Alternative Selection Structures a.    The if...else if... Structure b.    Error Checking: Just the Beginning c.    The switch Statement 7.    Putting it to Work a.    Greg’s Gambits: Madame Vadoma Knows All! i.    the Math object ii.    the Math.random() and Math.floor() methods iii.    Developing the program iv.    Writing the code v.    Putting it all together b.    Carla’s Classroom: An Arithmetic Lesson i.    Developing the program ii.    The return; statement iii.    The counter iv.    Getting ready to code 1.    The plan v.    The code in pieces 1.    Level One code 2.    Level Two code 3.    Level Three code 4.    A comment about checking the counter vi.    Putting it all together vii.    Finishing up 8.    Keywords 9.    Review Questions and Exercises 10.    Programming Challenges a.    On Your Own b.    Case Studies i.    Greg’s Gambits ii.    Carla’s Classroom iii.    Lee's Landscape iv.    Jackie's Jewelry 4:  Going Round and Round: the Repetition Structure 1.    Computers Don’t Get Bored with Repetition a.    Loop basics i.    Iterations ii.    Writing test conditions 1.    Beware the infinite loop! 2.    Don't let the user get trapped in a loop! 2.    Types of Loops a.    Pre-test and Post-test Loops b.    The Pre-test while Loop i.    Writing test conditions c.    The Post-test do...while Loop i.    Why use one rather than the other? ii.    Formatting the output: the toFixed() method d.    Sentinel-controlled Loops i.    Formatting the output: the toLowerCase() and toUpperCase() methods e.    Counter-controlled loops i.    Using a counter ii.    Shortcut operators 3.    The for Loop a.    The for Statement b.    The Initial Value c.    The Test Condition d.    The Increment/Decrement Statement e.    The Careful Bean Counter i.    Curly braces: do we really need them? 4.    Data validation a.    The isNan() Method b.    Checking for Integers c.    Using Compound Conditions for Data Validation d.    The charAt() Method e.    The length Property 5.    Putting it to Work a.    Greg’s Gambits: Encoding Secret Messages i.    What is Encryption? ii.    The charCodeAt() and String.fromCharCode() Methods 1.    Unicode and ASCII codes 2.    The charCodeAt() Method 3.    The String.fromCharCodeAt() Method iii.    Developing the Program iv.    Writing the Code v.    Putting It All Together vi.    Finishing Up b.    Carla’s Classroom: Advanced Arithmetic Lessons i.    Developing the Program ii.    Writing the Code iii.    The Code in Pieces 1.    Level One addition code 2.    Level Two and Level Three addition code 3.    Subtraction iv.    Putting It All Together 1.    A note about code v.    Finishing Up 7.    Keywords 8.    Review Exercises 9.    Programming Challenges a.    On Your Own b.    Case Studies i.    Greg’s Gambits ii.    Carla’s Classroom iii.    Lee's Landscape iv.    Jackie's Jewelry 5:  Advanced Decisions and Loops 1.    Some Simple Schoolroom Statistics a.    It All Adds Up b.    Computing Averages c.    The Range d.    Odd and Even e.    Integer Accuracy i.    The Math.round() method ii.    The Math.floor() and Math.ceil() methods 2.    To Continue or Not to Continue? a.    The break statement b.    The continue statement 3.    Nested Loops a.    Desk Checking b.    Different Ways to Nest loops i.    Which way should loops be nested? 4.    Drawing Shapes and Patterns With Loops a.    Drawing Shapes b.    Using Loops to Create Patterns c.    The mouse events 5.    Putting it to Work a.    Greg’s Gambits: The Battle Between the Wizard and the Troll i.    Developing the Program 1.    The button as a link 2.    The web pages ii.    Writing the Code iii.    Putting It All Together b.    Carla’s Classroom: A Grammar Lesson i.    Developing the Program ii.    Writing the Code iii.    The Code in Pieces 1.    The function and the outer loop 2.    Check for valid selections 3.    Displaying the story iv.    Putting It All Together 5.    Keywords 6.    Review Exercises 7.    Programming Challenges a.    On Your Own b.    Case Studies i.    Greg’s Gambits ii.    Carla’s Classroom iii.    Lee's Landscape iv.    Jackie's Jewelry 6:  Forms 1.    What is a Form? a.    The Most Basic Form i.    The tag pair ii.    The submit and reset buttons b.    Returning Form Submissions i.    The Common Gateway Interface (CGI) ii.    Returning form data by email iii.    Returning form data to a program 2.    Form Controls a.    Radio buttons b.    Checkboxes i.    The checked property c.    Textboxes i.    The label, fieldset, and legend elements d.    Textarea boxes i.    The email action 3.    Hidden Fields and Passwords a.    The hidden Form Element b.    The password Form Element i.    The substr() method 4.    Selection Lists and More a.    Selection lists i.    The size attribute ii.    The multiple attribute b.    Enhancements for Form Elements i.    The tabindex attribute ii.    The accesskey attribute iii.    The onfocus event iv.    An introduction to the this keyword v.    An image as an OK button 5.    Putting it to Work: a.    Greg’s Gambits: Player Information and Inventory i.    Developing the Program ii.    Writing the Code 1.    The textbox functions 2.    The radio buttons function 3.    The checkboxes functions iii.    Putting it All Together iv.    Finishing Up b.    Carla’s Classroom: Carla's Progress Report Form i.    Developing the Program 1.    Carla's categories 2.    The page design ii.    Creating the Form iii.    Writing the Code 1.    The textbox functions 2.    The radio buttons functions 3.    The textarea function 4.    Generating the email message iv.    Putting it All Together 8.    Review Exercises 9.    Programming Challenges a.    On Your Own b.    Case Studies i.    Greg’s Gambits ii.    Carla’s Classroom iii.    Lee's Landscape iv.    Jackie's Jewelry 7:  Keeping it Neat: Functions and JavaScript Source Files 1.    Functions a.    Built-in Functions b.    User-defined Functions 2.    The Scope of a Variable a.    Global variables b.    Local variables 3.    Sending Information to a Function a.    Passing Arguments to Parameters i.    The return statement ii.    Passing values: a complex issue iii.    Passing by value 4.    Objects and Object-Oriented Concepts a.    The Math Object b.    More JavaScript Objects i.    Passing by reference ii.    The Boolean object 1.    The new keyword iii.    The Date object 1.    The setTimeout() function 5.    JavaScript Source Files a.    Work Smarter, Not Harder b.    Creating and Accessing a JavaScript Source (.js) file i.    JavaScript source files cascade c.    Create a Library of Functions 6.    Putting it to Work: a.    Greg’s Gambits: Hangman i.    Developing the program 1.    The man in the noose 2.    The secret words ii.    Writing the code 1.    The startHangman() function 2.    The setCharAt() function 3.    The replace() method and regular expressions 4.    The revised checkWord() function iii.    Finishing up b.    Carla’s Classroom: Reading Comprehension i.    Creating the first page ii.    Writing the code 1.    Password protection 2.    The first web page 3.    Use the visibility property to create a hidden button 4.    Building the page with questions 5.    What the student sees iii.    Putting it all together iv.    Finishing up 8.    Review Exercises 9.    Programming Challenges a.    On Your Own b.    Case Studies i.    Greg’s Gambits ii.    Carla’s Classroom iii.    Lee's Landscape iv.    Jackie's Jewelry 8:  Arrays 1.    One-Dimensional Arrays a.    Creating an Array in JavaScript b.    The Array object i.    The length property ii.    Some methods of the Array object 2.    Populating Arrays a.    Loading Arrays Directly b.    Loading Arrays Interactively c.    Displaying Arrays d.    Why Use Arrays? 3.    Using Array Methods a.    The push() Method b.    The unshift() Method c.    The splice() Method 4.    Multi-Dimensional Arrays a.     Introduction to Two-Dimensional Arrays b.    Declaring and Filling Two-Dimensional Arrays 5.    Putting it to Work: a.    Greg’s Gambits: The Game of 15 i.    Developing the Program 1.    Setting the stage 2.    Creating the array with the setup() function 3.    Populating the array with the Math.random() function 4.    The code to exchange cell values 5.    The code to check for a winner ii.    Putting It All Together b.    Carla’s Classroom: Images and Imagination i.    Setting Things Up ii.    Developing the Program 1.    Setting the stage 2.    The image swap a.    Practice the image swap 3.    The slide show iii.    Putting It All Together 10.    Review Exercises 11.    Programming Challenges a.    On Your Own b.    Case Studies i.    Greg’s Gambits ii.    Carla’s Classroom iii.    Lee's Landscape iv.    Jackie's Jewelry 9:  Searching and Sorting 1.    Sorting Arrays a.    The sort() method b.    Sorting numbers with the sort() method c.    The reverse() method 2.    The Bubble Sort a.    Swapping values b.    Using the Bubble Sort Algorithm c.    Passing Arrays 3.    The Selection Sort 4.    Searching  Arrays: the Serial Search a.    Using the Serial Search With Parallel Arrays 5.    Searching Arrays: the Binary Search a.    The Binary Search b.    Making Life Easier: the indexOf() Method i.    The indexOf() method ii.    The lastIndexOf() method iii.    Time out! Using the setInterval() method 6.    Putting it to Work: a.    Greg’s Gambits: Greg's Boggle i.    Developing the Program ii.    Setting the Stage 1.    Creating the boggle() function 2.    The toString() method 3.    The boggle() function iii.    Putting it All Together b.    Carla’s Classroom: A Factoring Lesson i.    Factoring Integers ii.    Developing the Program iii.    Setting the Stage iv.    The Code in Pieces 1.    The external file 2.    The beginning 3.    Selecting the number and some housekeeping tasks 4.    Getting student responses v.    Putting it All Together 7.    Review Exercises 8.    Programming Challenges c.    On Your Own d.    Case Studies v.    Greg’s Gambits vi.    Carla’s Classroom vii.    Lee's Landscape viii.    Jackie's Jewelry 10:  The Document Object Model and XML 1.    The Document Object Model: DOM a.    A Brief History of DOM b.    DOM Nodes and Trees c.    The Family: the Parent-Child Model d.    Creating and Inserting Elements i.    The createTextNode() method e.    Replacing and Removing Elements i.    The removeChild() method ii.    The replaceChild() method iii.    The childNodes property 2.    Using DOM Methods with Timers and Styles a.    The setAttribute() and getAttribute() Methods b.    The setInterval() and clearInterval() Methods 3.    XML Basics a.    What is XML? b.    Why Do We Need XML? c.    XML Components i.    The XML declaration ii.    XML elements iii.    Comments and filenames iv.    XML attributes v.    XML entities vi.    Whitespace vii.    Well-formed documents d.    XML Parsers and DTDs i.    XML internal DTDs ii.    XML external and public DTDs 4.    Adding Style and XSL Transformations a.    Using Cascading Style Sheets with XML Documents b.    The Extensible Stylesheet Language (XSL) i.    One important note 5.    XML Namespaces and Schemas a.    XML Namespaces i.    The Uniform Resource Identifier (URI) ii.    Namespace declarations b.    XML Schemas i.    Creating a reference to a schema in an XML document ii.    There's more… c.    XML Schema Datatypes d.    Creating an XML Schema 6.    Putting it to Work: a.    Greg’s Gambits: Greg's Avatars i.    Developing the Program ii.    Setting the Stage iii.    Creating the XML, XSL, and JavaScript Pages 1.    Creating the XML page 2.    Creating the XSL page 3.    Creating the JavaScript page and DOM code iv.    Putting it All Together b.    Carla’s Classroom: A Spelling Lesson i.    Developing the Program ii.    Setting the Stage iii.    The Code in Pieces 1.     The functions to extract values from the selected image and spelling 2.    The function to compare the values 3.    The function to check for success iv.    Putting it All Together 7.    Review Exercises 8.    Programming Challenges a.    On Your Own b.    Case Studies i.    Greg’s Gambits ii.    Carla’s Classroom iii.    Lee's Landscape iv.    Jackie's Jewelry 11:  PHP: An Overview 1.    A Brief History of PHP a.    What Does a Server Do? i.    HTTP get and post request types b.    The Apache HTTP Server, MySQL, and PHP i.    The Apache HTTP server ii.    The MySQL database iii.    PHP and XAMPP 2.    XAMPP a.    Installing XAMPP i.    Security ii.    The license iii.    The install b.    Try It Out i.    Let's get started ii.    Your first PHP program 3.    PHP Basics a.    PHP Filenames, the htdocs Folder, and Viewing Your PHP Pages b.    Variables and Methods i.    Converting datatypes with the settype() and gettype() methods ii.    Converting datatypes with type casting c.    PHP Keywords d.    Operators i.    Unary operators ii.    Binary operators 1.    Operator precedence iii.    Ternary operators iv.    Concatenation operators 4.    Using Conditionals and Loops a.    Making Decisions: the Selection Structure i.    The echo construct ii.    The switch statement b.    Cycling Through: Repetitions and Loops 5.    Arrays and Strings a.    Arrays i.    The reset() method ii.    The foreach construct, the as keyword, and the ==> operator iii.    The key() method b.    Why Are We Learning All This? c.    Working With Strings i.    Comparing strings ii.    Searching for expressions: the preg_match() and preg_replace() methods 6.    Putting It To Work a.    Greg's Gambits: PHP Welcome Messages i.    Developing a new format for Greg's pages: organizing a site ii.    The header and footer files iii.    Setting the stage iv.    The ajax_post() function 1.    The onclick="javascript:ajax_post()"; event 2.    The ajaxDataPipe.php page v.    Putting it all together b.    Carla's Classroom: Using PHP for Hints i.    Developing the program 1.    The folders 2.    The header.php file 3.    The footer.php file 4.    The carla_phpDemo.php file 5.    The showHint() function 6.    The gethint.php file 7.    The $_GET superglobal variable 8.    The count() method 9.    The strtolower() method ii.    Putting it all together 7.    Review Exercises 8.    Programming Challenges a.    On Your Own b.    Case Studies i.    Greg’s Gambits ii.    Carla’s Classroom iii.    Lee's Landscape iv.    Jackie's Jewelry 12:  Using PHP with Cookies and MySQL 1.    Cookies a.    Types of Cookies b.    Writing Cookies i.    The time() function ii.    Writing and reading your first cookie iii.    The define() method iv.    The isset() method v.    The $_SERVER('PHP_SELF') method 2.    A Database Server: MySQL a.    An Overview of MySQL i.    The license b.    Setting Up a MySQL User Account i.    Create a new user ii.    Assigning privileges c.    The Database Structure d.    Building a Small Business Database i.    Jackie's tables ii.    The primary key and the foreign key iii.    Table fields iv.    Field attributes e.    Creating the Database With phpMyAdmin i.    Create the jackiejewelry database 3.    Populating a Database From the Web a.    The Web Page Form i.    The die() method ii.    The mysql_error() method iii.    The mysql_query() method iv.    The mysql_connect() method v.    The mysql_select_db() method 4.    Sending Emails From Database Information Using PHP a.    The Form i.    The mysql_fetch_array() method ii.    The mail() method 5.    Putting it to Work: a.    Greg’s Gambits: Create and Validate an Account and Log In i.    Creating the database ii.    Creating User Accounts and Login Pages 1.    The newUser.php file 2.    The header.php file 3.    The footer.php file 4.    Connecting to the database using the connectDB.php file 5.    Closing the connection using the closeDB.php file 6.    The addUser.php file iii.    Testing it Out iv.    The New Beginning: the index.php page 1.    The session 2.    The index.php page 3.    The logIn.php page 4.    The session_start() method and the $_SESSION superglobal 5.    The validate_loginForm(this form), validate_userName(), and validate_passWord() functions 6.    The with() reserved word (keyword) v.    Creating the User Information Page vi.    Let's Play a Game! vii.    Putting it All Together b.    Carla’s Classroom: Using PHP to Send Student Reports By Email i.    Creating the Database 1.    The folders ii.    Adding a Student to the Database 1.    The index.php file 2.    Inserting a new record: making the connection 3.    The insert.php file iii.    Creating and Sending the Email 1.    The sendEmail.php file 2.    The getStudent.php file iv.    Putting it All Together 6.    Review Exercises 7.    Programming Challenges a.    On Your Own b.    Case Studies i.    Greg’s Gambits ii.    Carla’s Classroom iii.    Lee's Landscape iv.    Jackie's Jewelry