Training Guide: Programming in HTML5 with JavaScript and CSS3 Ebook

Practice exercises CHAPTER 6 297

3. You are interested in locating all

   elements on your webpage, so your statement is
   var paragraphs = $(‘p’). Which line of code would confirm whether at least one ele-
   ment is found?
   A. if( paragraphs.exists)
   B. if( paragraphs==null)
   C. if( paragraphs.length)
   D. if( paragraphs.count > 0)

Practice exercises

If you encounter a problem completing any of these exercises, the completed projects can be

installed from the Practice Exercises folder that is provided with the companion content.

Exercise 1: Create a calculator object

In this exercise, you apply your JavaScript object-oriented programming knowledge by

modifying the calculator you’ve been using to have a calculator object in the calculatorLibrary

namespace and changing JavaScript code to use jQuery when necessary.

1. Start Visual Studio Express 2012 for Web. Click File and choose Open Project.
   Navigate to the solution you created in Chapter 5, “More HTML,” and select the
   webCalculator.sln file. Click Open.
   If you didn’t complete the exercises in Chapter 5, you can use the solution in the
   Chapter 6 Exercise 1 Start folder.


2. In the Solution Explorer window, right-click the CalculatorTests.html file and choose Set
   As Start Page. Press F5 to verify that your test runs and passes.


3. In the Solution Explorer window, add jQuery to the project by right-clicking the project
   node. Choose Manage NuGet Packages. Type jQuery in the search online text box and
   click the search button. Click the Install button on the jQuery result.


4. Add a file to the Scripts folder called _references.js and, in the file, add a reference to
   jQuery, QUnit, and the CalculatorLibrary.
   Your file should look like the following.
   ///
   ///
   ///


5. Open the CalculatorLibrary.js file and add a reference to the _references.js file.


6. Create the calculatorLibrary namespace by surrounding the existing code in the
   CalculatorLIbrary.js file with an immediately invoked function expression (IIFE). In the
   IIFE, create an alias to calculatorNamespace called ns, which will save you from typing
   the complete namespace while you’re in the IIFE.