Free Web Design, Development and Programming Training and Tutorial Resources




    



January 8, 2007

Replacing outdated DHTML with DOM Scripting in your JavaScript

This JavaScript Tutorial is aimed at beginners to help them understand how old and outdated JavaScript techniques can cause issues on a web page. The tutorials proceeds by analyzing the source code of a web page that was written several years ago using concepts that were ok good to use then, but in the current Web will render inaccessible or broken pages in a browser.

Three dynamic elements using JavaScript are reviewed and explained from the point of view when they were originally developed, and then a more current method of re-writing them is demonstrated making them more hardened and less error-prone in regards to DOM scripting. The tutorial starts with providing some understanding about what DHTML and the DOM are. The example web site containing the JavaScript code examples are available for download as a zip file.

From DHTML to DOM Scripting – How to replace outdated javascript techniques

Download PDF version (202KB)


Table of Contents



Tags for this post>> | |
March 30, 2006

Dynamic HTML (DHTML) Training Course

This is a freely available training course covering the material you need to learn and understand Dynamic HTML (DHTML) and to develop attractive, compelling, and interactive web sites. This training course teaches you how to use DHTML and how its collection of technologies are designed to work together. For each training module below, a link for text-only training content is listed first, followed by the link for computer based training (CBT) with Graphics, for which the quizzes are not freely available and Internet Explorer is required. Dynamic HTML: DHTML and Style Sheets: Text-only training: tinyurl.com/m3twu CBT training: tinyurl.com/r2j4w In this training unit, you’ll learn how Cascading Style Sheets, scripting languages, advanced multimedia effects, and data binding all work together to help you create compelling Web-based documents and applications. Dynamic HTML: Using JavaScript: Text-only training: tinyurl.com/my5ox CBT training: tinyurl.com/oeygt In this training unit, we’ll examine a basic requirement of Dynamic HTML — a scripting language for instructions. We’ll briefly compare the two major scripting languages available, and why JavaScript is a strong choice. We’ll also begin examining the basic building blocks of JavaScript, including statements, blocks, and comments. Dynamic HTML: Objects and Events: Text-only training: tinyurl.com/lpyra CBT training: tinyurl.com/l795a In this training unit, you will learn what an object model is and how it relates to raw data. Dynamic HTML: Styles and Content: Text-only training: tinyurl.com/reeaj CBT training: tinyurl.com/qayno In this training unit, you’ll learn about dynamic styles. This DHTML feature lets you dynamically change the characteristics of style elements during runtime. You’ll learn how to change font styles, sizes, and colors. Dynamic HTML: Data from Other Sources: Text-only training: tinyurl.com/ngyeu CBT training: tinyurl.com/m73d7 In this training unit, you will learn about the differences between traditional forms of server-side data binding and newer forms of client-side data binding. You will also learn how DHTML client-side data binding has made advances over early methods of JavaScript client-side data binding.

Tags for this post>> |