test

More documents

Recommendations

Info

Chapter 15 Local data with web storage 555 Lesson 1: Introducing web storage ................................555 Understanding cookies 556 Using the jQuery cookie plug-in 556 Working with cookie limitations 557 Alternatives to cookies prior to HTML5 557 Understanding HTML5 storage 558 Exploring localStorage 560 Using short-term persistence with sessionStorage 562 Anticipating potential performance pitfalls 563 Lesson summary 564 Lesson review 564 Lesson 2: Handling storage events ................................565 Sending notifications only to other windows 566 Using the StorageEvent object reference 566 Subscribing to events 567 Using events with sessionStorage 568 Lesson summary 568 Lesson review 568 Practice exercises ...............................................569 Exercise 1: Create a contact book by using localStorage 569 Suggested practice exercises .....................................578 Answers ........................................................579 Lesson 1 579 Lesson 2 580 Chapter 16 Offline web applications 581 Lesson 1: Working with Web SQL .................................582 Considering the questionable longevity of Web SQL 582 Creating and opening the database 582 Performing schema updates 583 Using transactions 584 xvi Contents
Lesson summary 588 Lesson review 589 Lesson 2: Working with IndexedDB ................................589 Using browser-specific code 590 Creating and opening the database 590 Using object stores 591 Using transactions 593 Inserting a new record 594 Updating an existing record 594 Deleting a record 595 Retrieving a record 595 Understanding cursors 596 Dropping a database 599 Lesson summary 599 Lesson review 600 Lesson 3: Working with the FileSystem API .........................600 Assessing browser support 601 Opening the file system 601 Creating and opening a file 602 Writing to a file 602 Reading a file 603 Deleting a file 604 Creating and opening a directory 604 Writing a file to a directory 605 Deleting a directory 605 Lesson summary 606 Lesson review 606 Lesson 4: Working with the offline application HTTP cache ...........607 Browser support 608 The cache manifest file 608 Updating the cache 609 Understanding events 610 Contents xvii
Page 1 and 2: Programming in HTML5 with JavaScrip
Page 3: Contents at a glance Introduction x
Page 6 and 7: Exercise 1: Hello World with Visual
Page 8 and 9: Adding comments within a style shee
Page 10 and 11: Understanding the JavaScript object
Page 12 and 13: Lesson summary 381 Lesson review 38
Page 20 and 21: Backward compatibility and cross-br
Page 22 and 23: If you find an error that is not al
Page 24 and 25: HTML, CSS, and JavaScript are three
Page 26 and 27: ■■ Automatic Renaming When you
Page 28 and 29: mundane tasks that would be common
Page 30 and 31: FIGURE 1-3 Blank App template with
Page 32 and 33: FIGURE 1-4 The New Project screen w
Page 34 and 35: ■■ Visual Studio Express 2012 f
Page 36 and 37: NOTE RUN CONSTRAINT FOR BLEND Blend
Page 38 and 39: The rightmost window contains the f
Page 40 and 41: ■■ ■■ ■■ ■■ Display
Page 42 and 43: ■■ ■■ The Device panel enab
Page 44 and 45: Hello Visual Studio for Win
Page 46 and 47: Exercise 3: Hello World with Blend
Page 48 and 49: Answers This section contains the a
Page 51 and 52: CHAPTER 2 Getting started with HTML
Page 53 and 54: problems in HTML, which was up to v
Page 55 and 56: ■ ■ ■ ■ ■ ■ ■ ■ ■
Page 57 and 58: ■ ■ ■ ■ ■ ■ ■ ■ ■
Page 59 and 60: HTML5 global attribute reference HT
Page 61 and 62: ■ ■ ■ ■ ■ ■ Defines a
Page 63 and 64: Key Terms In this example, the el
Page 65 and 66: ■■ ■■ ■■ HTML entities
Page 67 and 68:
“Working with hyperlinks” secti
Page 69 and 70:
of all menu links to be content so
Page 71 and 72:
Quick check ■■ You are creating
Page 73 and 74:
The tag The tag embeds an object
Page 75 and 76:
Lesson review Answer the following
Page 77 and 78:
15. Using the element to create a
Page 79 and 80:
3. To view this page, right-click t
Page 81 and 82:
FIGURE 2-3 The rendered home page w
Page 83 and 84:
FIGURE 2-4 The default.html page sh
Page 85:
C. Incorrect: The use of disabled w
Page 88 and 89:
Lesson 1: Introducing JavaScript Th
Page 90 and 91:
SPECIAL VALUES The number type supp
Page 92 and 93:
Using unary operators When an opera
Page 94 and 95:
In this example, another statement
Page 96 and 97:
Using function declarations A funct
Page 98 and 99:
The drawback of this loose behavior
Page 100 and 101:
If this code were inside a function
Page 102 and 103:
Using the String function The Strin
Page 104 and 105:
Using the switch keyword The switch
Page 106 and 107:
It’s interesting to note that or
Page 108 and 109:
initialize a loop variable. This se
Page 110 and 111:
Remember that the finally block alw
Page 112 and 113:
Hello World from JavaScript There a
Page 114 and 115:
FIGURE 3-5 The QUnit summary screen
Page 116 and 117:
FIGURE 3-6 The QUnit summary screen
Page 118 and 119:
FIGURE 3-8 The Manage NuGet Package
Page 120 and 121:
App2 Tests Now
Page 122 and 123:
FIGURE 3-11 The QUnit-Metro summary
Page 124 and 125:
alert(Add(3, 2)); //--> Your brows
Page 126 and 127:
can also click the gray vertical ba
Page 128 and 129:
was set to 9 and, in the Locals win
Page 130 and 131:
3. Where should your JavaScript cod
Page 132 and 133:
looping through the items in the ar
Page 134 and 135:
■■ ■■ different delimiter,
Page 136 and 137:
following example, the period (.) i
Page 138 and 139:
A variation of the inline method of
Page 140 and 141:
Form event reference The following
Page 142 and 143:
■■ ■■ ■■ ■■ ■■
Page 144 and 145:
1. If you haven’t installed Visua
Page 146 and 147:
QUnit example test marku
Page 148 and 149:
12. Press F5 to run the test, which
Page 150 and 151:
17. Press F5 to run the test, and a
Page 152 and 153:
txtInput.value = '10'; QUnit.trigge
Page 154 and 155:
var expected = '10'; equal(txtResul
Page 156 and 157:
Answers This section contains the a
Page 159 and 160:
CHAPTER 4 Getting started with CSS3
Page 161 and 162:
Key Terms Probably the most powerfu
Page 163 and 164:
ut it does not promote reuse across
Page 165 and 166:
Specifying the character encoding o
Page 167 and 168:
■■ ■■ ■■ ■■ The dec
Page 169 and 170:
This style won’t apply to any ele
Page 171 and 172:
pseudo classes at the end of the se
Page 173 and 174:
} color: gray; Key Terms Using subs
Page 175 and 176:
FIGURE 4-2 All subsequent elements
Page 177 and 178:
Link 1 Link 2 Link 3 The first e
Page 179 and 180:
Using the attribute value ends with
Page 181 and 182:
Understanding the browser’s built
Page 183 and 184:
The author of the page can provide
Page 185 and 186:
Using the inherit value The previou
Page 187 and 188:
3. The following style sheet rule i
Page 189 and 190:
Most colors can be represented by u
Page 191 and 192:
Color Name Hex Value Decimal Value
Page 193 and 194:
Color Name Hex Value Decimal Value
Page 195 and 196:
FIGURE 4-8 The HSL color wheel Key
Page 197 and 198:
■■ ■■ ■■ ■■ ■■
Page 199 and 200:
Figure 4-11 shows the rendered we
Page 201 and 202:
atomorum mea. Ad vis illum porro di
Page 203 and 204:
The first thing you might want to d
Page 205 and 206:
Now that div2 is non-static, what w
Page 207 and 208:
} left: 30px; width: 450px; height:
Page 209 and 210:
} #div2 { background-color: cyan; }
Page 211 and 212:
FIGURE 4-19 Using the float propert
Page 213 and 214:
} #div1 { background-color: yellow;
Page 215 and 216:
Centering content in the browser wi
Page 217 and 218:
Exercise 1: Add a style sheet to th
Page 219 and 220:
FIGURE 4-22 The web calculator user
Page 221 and 222:
} margin-right: auto; text-align: c
Page 223 and 224:
FIGURE 4-23 The completed web calcu
Page 225 and 226:
B. Incorrect: The first part of the
Page 227 and 228:
CHAPTER 5 More HTML5 The previous c
Page 229 and 230:
NVDA devices need your help to inte
Page 231 and 232:
■ ■ A unit of content that can
Page 233 and 234:
Copyright (C) 2012, Contoso Ltd.,
Page 235 and 236:
Controlling format by using the el
Page 237 and 238:
y Contoso, Inc. Note that the titl
Page 239 and 240:
display on one line, but the keepWh
Page 241 and 242:
Key Terms Working with figures A fi
Page 243 and 244:
Use the element to place a notatio
Page 245 and 246:
FIGURE 5-7 The unordered list rende
Page 247 and 248:
Boats Sea Ray Cobalt Figure 5-
Page 249 and 250:
ul.level1 > li:before { counter-inc
Page 251 and 252:
Page 253 and 254:
Figure 5-12 shows the rendered outp
Page 255 and 256:
Declaring the header, footer, and t
Page 257 and 258:
FIGURE 5-14 The styled table Althou
Page 259 and 260:
} tfoot th { background-color: #C2F
Page 261 and 262:
FIGURE 5-15 The rendered page with
Page 263 and 264:
} text-align: right; th { border: t
Page 265 and 266:
■■ ■■ Use the element dire
Page 267 and 268:
The main element with the calculat
Page 269 and 270:
2. After that style rule, insert an
Page 271 and 272:
15. After the aside style rule, add
Page 273 and 274:
} #container { min-width: 800px; }
Page 275 and 276:
3. Surround the inputs and buttons
Page 277 and 278:
C 7 8 9 + 4 5 6 -
Page 279 and 280:
FIGURE 5-19 The completed calculato
Page 281:
C. Incorrect: The element must be
Page 284 and 285:
Lesson 1: Creating JavaScript objec
Page 286 and 287:
var car2 = { year: 2010, make: 'BMW
Page 288 and 289:
After the object is created, you ca
Page 290 and 291:
FIGURE 6-2 The failing test asserti
Page 292 and 293:
FIGURE 6-3 Successful first asserti
Page 294 and 295:
this.make = theMake; this.model = t
Page 296 and 297:
eplace individual instance function
Page 298 and 299:
FIGURE 6-7 The use of getters to ex
Page 300 and 301:
Key Terms An IIFE (pronounced iffy)
Page 302 and 303:
which accepts a parameter for the t
Page 304 and 305:
var actual = c.startEngine(); var e
Page 306 and 307:
■■ ■■ ■■ ■■ ■■
Page 308 and 309:
■■ ■■ ■■ ■■ ■■
Page 310 and 311:
QUnit example test markup, wil
Page 312 and 313:
In Figure 6-11, notice there is an
Page 314 and 315:
All the IntelliSense suggestions ha
Page 316 and 317:
txtInput, so proper IntelliSense ca
Page 318 and 319:
It’s best to place this at the bo
Page 320 and 321:
Your code should look like the foll
Page 322 and 323:
}; txtInput.value = '0'; txtResult.
Page 324 and 325:
Calculator.prototype.plusClick = fu
Page 326 and 327:
1 2 3 0 Adverti
Page 328 and 329:
' Actual value: ' + $('#txtInput').
Page 330 and 331:
Page 333 and 334:
CHAPTER 7 Working with forms The pr
Page 335 and 336:
FIGURE 7-1 The request/response mod
Page 337 and 338:
■■ ■■ ■■ ■■ Receive
Page 339 and 340:
■ ■ ■ ■ ■ ■ ■ ■ ■
Page 341 and 342:
Another interesting benefit from us
Page 343 and 344:
The QueryString is a list of name v
Page 345 and 346:
Key Terms An advantage of using the
Page 347 and 348:
with validation at the browser is t
Page 349 and 350:
FIGURE 7-6 The placeholder text dis
Page 351 and 352:
Validating numbers and ranges Use t
Page 353 and 354:
C. required D. user name 2. When yo
Page 355 and 356:
10. Add a element containing a el
Page 357 and 358:
Figure 7-10 shows the ContactUs.htm
Page 359 and 360:
FIGURE 7-11 The completed page with
Page 361:
3. Correct answer: D A. Incorrect:
Page 364 and 365:
After this lesson, you will be able
Page 366 and 367:
var http = require('http'); var url
Page 368 and 369:
The following is a typical folder s
Page 370 and 371:
In the advanced_math.js file, the r
Page 372 and 373:
"addition", "subtraction", "multipl
Page 374 and 375:
After the package is globally insta
Page 376 and 377:
Uninstalling a package Uninstall a
Page 378 and 379:
FIGURE 8-7 Installing express, whic
Page 380 and 381:
This statement starts with app.use,
Page 382 and 383:
Did you notice that the URL to get
Page 384 and 385:
}); if (request.method.toLowerCase(
Page 386 and 387:
Lesson 2: Working with web services
Page 388 and 389:
You can implement security by using
Page 390 and 391:
The addition operation uses the GET
Page 392 and 393:
In the math web service, the result
Page 394 and 395:
} if (xmlhttp.readyState == 4 && xm
Page 396 and 397:
■ ■ ■ ■ .serialize() Helper
Page 398 and 399:
} var y = $('#y').val(); var data =
Page 400 and 401:
When you use jQuery to execute an A
Page 402 and 403:
function serverDivision(data) { ret
Page 404 and 405:
Page 406 and 407:
} } “formidable”: “1.x”,
Page 408 and 409:
The modified element should look l
Page 410 and 411:
Contoso Ltd. Your success equ
Page 412 and 413:
FIGURE 8-15 The submitted form disp
Page 414 and 415:
2. Correct answer: A A. Correct: XM
Page 416 and 417:
This lesson focuses on jQuery’s d
Page 418 and 419:
FIGURE 9-1 The Deferred and Promise
Page 420 and 421:
“always!” message before the
Page 422 and 423:
Quick check ■■ You want to chai
Page 424 and 425:
} }); return fourthPromise; In this
Page 426 and 427:
Lesson 2: Working with web workers
Page 428 and 429:
■■ ■■ The postMessage metho
Page 430 and 431:
15. Add a element inside the messa
Page 432 and 433:
22. To provide an animated fade-in
Page 434 and 435:
31. Add a hideCoverAsync function.
Page 436 and 437:
Lesson 2 1. Correct answer: D A. In
Page 438 and 439:
that the client is waiting for data
Page 440 and 441:
var webSocket; $(document).ready(fu
Page 442 and 443:
When the webpage is displayed using
Page 444 and 445:
function onClose(evt) { cancelKeepA
Page 446 and 447:
Socket.IO has a client-side and ser
Page 448 and 449:
■■ ■■ Author: your name Lic
Page 450 and 451:
The adduser event is triggered afte
Page 452 and 453:
7. Click Install to install jQuery.
Page 454 and 455:
13. Open the default.js file. To ge
Page 456 and 457:
function addUser() { socket.emit('a
Page 458 and 459:
Page 460 and 461:
Video formats The W3C is trying to
Page 462 and 463:
FIGURE 11-1 The Firefogg screen pro
Page 464 and 465:
Using the WebVTT format WebVTT form
Page 466 and 467:
Much of the content in this lesson
Page 468 and 469:
■■ ■■ preload Specifies how
Page 470 and 471:
■■ ■■ ■■ ■■ ■■
Page 472 and 473:
Using media control Given that HTML
Page 474 and 475:
C. onplay D. onloadeddata Practice
Page 476 and 477:
} border-style: groove; width: 900p
Page 478 and 479:
Page 481 and 482:
CHAPTER 12 Drawing with HTML5 In th
Page 483 and 484:
■■ ■■ ■■ ■■ ■■
Page 485 and 486:
$(document).ready(function () { dra
Page 487 and 488:
Configuring the drawing state In th
Page 489 and 490:
, height = 50 , offset = 10; gradie
Page 491 and 492:
Figure 12-4 shows a small image wit
Page 493 and 494:
FIGURE 12-6 The lineWidth, increase
Page 495 and 496:
addColorStops(gradient); ctx.stroke
Page 497 and 498:
In this example, the lineWidth, str
Page 499 and 500:
ctx.closePath(); ctx.fill(); ctx.st
Page 501 and 502:
FIGURE 12-11 The rendered output, u
Page 503 and 504:
} ctx.moveTo(300, 300); ctx.lineTo(
Page 505 and 506:
ctx.lineWidth = 1; ctx.beginPath();
Page 507 and 508:
FIGURE 12-15 Changing the radius ch
Page 509 and 510:
ctx.strokeStyle = 'blue'; ctx.fillS
Page 511 and 512:
The line is drawn as its own path,
Page 513 and 514:
} var img = new Image(); img.src =
Page 515 and 516:
ctx.beginPath(); ctx.moveTo(405, 18
Page 517 and 518:
Page 519 and 520:
The following is a list of commands
Page 521 and 522:
FIGURE 12-24 The rendered car using
Page 523 and 524:
FIGURE 12-25 The element automatic
Page 525 and 526:
9. In the CanvasPage.html file, add
Page 527 and 528:
Suggested practice exercises The fo
Page 529 and 530:
CHAPTER 13 Drag and drop Prior to H
Page 531 and 532:
} -ms-user-select: none; user-selec
Page 533 and 534:
The following code is placed in the
Page 535 and 536:
Quick check ■■ Which two events
Page 537 and 538:
}); $('#favoriteCars').on('drop', d
Page 539 and 540:
E. dragover F. dragleave G. drop 2.
Page 541 and 542:
FIGURE 13-5 The webpage with style
Page 543 and 544:
FILE 13-6 The completed webpage aft
Page 545 and 546:
6. Add a reference to the jQuery li
Page 547 and 548:
These functions are created next. Y
Page 549 and 550:
$('#gameBoard').on('dragover', prev
Page 551 and 552:
$('#gameBoard').on('dragenter', pre
Page 553 and 554:
$(document).ready(function () { jQu
Page 555 and 556:
function dragStarted(e) { var $tile
Page 557 and 558:
Page 559:
Lesson 2 1. Correct answers: D, E,
Page 562 and 563:
Before you begin To complete this b
Page 564 and 565:
$(document).ready(function () { get
Page 566 and 567:
In this example, the showError func
Page 568 and 569:
Page 570 and 571:
} var datetime = new Date(position.
Page 572 and 573:
Practice exercises If you encounter
Page 574 and 575:
} } showMessage("Geolocation is not
Page 576 and 577:
Page 578 and 579:
After this lesson, you will be able
Page 580 and 581:
Looking beyond plug-ins Although th
Page 582 and 583:
This chapter examines the two types
Page 584 and 585:
Reaching the storage limit If the s
Page 586 and 587:
No transaction support Another bene
Page 588 and 589:
efore that entry was updated in bro
Page 590 and 591:
} alert(e.originalEvent.newValue);
Page 592 and 593:
Email Name First Name:
Page 594 and 595:
} clear: left; display: block; floa
Page 596 and 597:
} var html = ''; for (var i = 0; i
Page 598 and 599:
}); (function () { this.contactsNam
Page 600 and 601:
Page 602 and 603:
5. Correct answer: D A. Incorrect:
Page 604 and 605:
Lesson 1: Working with Web SQL Web
Page 606 and 607:
Adding a table You can add an autho
Page 608 and 609:
function itemInserted(transaction,
Page 610 and 611:
displayResults) }); Using JOIN comm
Page 612 and 613:
stores. Much like Web SQL, interfac
Page 614 and 615:
Using the keypath property One impo
Page 616 and 617:
var trans = db.transaction('authors
Page 618 and 619:
} request.onerror = function(respon
Page 620 and 621:
■■ ■■ ■■ ■■ lowerOp
Page 622 and 623:
Page 624 and 625:
Creating and opening a file To crea
Page 626 and 627:
} fileReader.onerror = function() {
Page 628 and 629:
function directoryOpened(directoryE
Page 630 and 631:
Browser support The application cac
Page 632 and 633:
Understanding events In general, th
Page 634 and 635:
2. The names of the IndexedDB varia
Page 636 and 637:
Because the results array that’s
Page 638 and 639:
}; }; displayCurrentRecord(); funct
Page 640 and 641:
2. Correct answer: B A. Incorrect:
Page 643 and 644:
Index Symbols && (and) operator, 70
Page 645 and 646:
Blend for Visual Studio 2012 Signal
Page 647 and 648:
cascading if statements call method
Page 649 and 650:
CSS properties implementing code lo
Page 651 and 652:
DOM (document object model) setting
Page 653 and 654:
external JavaScript files language,
Page 655 and 656:
Geolocation API font families, 173-
Page 657 and 658:
HTMLMediaElement object element ad
Page 659 and 660:
IndexedDB tool described, 590 mode
Page 661 and 662:
lang global attribute described, 26
Page 663 and 664:
namespaces margin properties (CSS),
Page 665 and 666:
opacity property (CSS) private data
Page 667 and 668:
QueryString embedding content from,
Page 669 and 670:
short-circuit evaluation sandbox at
Page 671 and 672:
tables String() function, 78, 80 St
Page 673 and 674:
element type attribute element, 31
Page 675 and 676:
window object web farms, 422-423 we
Page 677:
About the author GLENN JOHNSON is a
Page 680 and 681:
USE CSS3 IN APPLICATIONS Style HTML
show all

test

Create successful ePaper yourself

Delete template?

Save as template?