I have been fortunate enough to have just passed the Microsoft 070-480 exam.  I took this test to increase my proficiency in HTML5, JavaScript, and CSS.

This test brought home the fact that HTML should be separated from JavaScript and CSS.  I used to bury script tags in my HTML code all the time, embed CSS, and set body onload events directly in HTML.

I had also never taken advantage of self-invoking functions in JavaScript.  So I wanted to create a code sample for myself that I’d like to share with you that does the following things:

  1. Uses a self-invoking function to add an event to the document ensuring all follow-on JavaScript runs once controls are rendered.
  2. Use a self invoking function to avoiding use of the onload attribute of the body tag.  Bonus:  Use arguments!
  3. Use JavasScript shortcut functionality to check conditions.
  4. Use addEventListener and removeEventListener to change the behavior of a control.
  5. Modify the contents of controls (in an albeit minor way) using JavaScript.
  6. Use JavaScript to change the style of an element (the body).

HTML Code, file index.html

CSS Code, file styles.css

JavaScript Code, file scripts/script.js

One of the things that really helped me to pass this test was just to play.  Now that I have these new skills, I plan on keeping myself sharp by applying this knowledge to my current and future projects as appropriate as well as having a little fun on my own.

Happy coding!

Need to test the height of this box....

Social Wall