Personal Web & Sample Site
Skip Navigation Links
HOME |
About Me |
Articles
| Contact Us
DHTML DOM
Rating: 6 user(s) have rated this article Average rating: 5.0
Posted by: joet, on 9/15/2011, in category "Web Design"
Views: this article has been read 2548 times
Location: Houston, Tx, United States
Abstract: The document object model, if you're going to learn DHTML which most often requires javascript, you need to know about the DOM. Developers of early scripting languages created an object hierarchy, which is a system of organization that allows Web page developers to describe and work with the Web page elements in a browser window.

 

The document object model, if you're going to learn DHTML which most often requires javascript, you need to know about the DOM. Developers of early scripting languages created an object hierarchy, which is a system of organization that allows Web page developers to describe and work with the Web page elements in a browser window. The DOM categorizes and groups Web page elements into a tree-like structure. Each part of this structure is referred to as an object. For example, in the basic JavaScript DOM, a page's images, forms, anchors, and links are all grouped beneath the document object.

Window

  • Location
  • Frames
  • History
  • Navigator
  • Event
  • Screen
  • Document
    • links
    • anchors
    • images
    • filters
    • forms
    • applets
    • embeds
    • plug-ins
    • frames
    • scripts
    • all
    • selection
    • stylesheets
    • body

Why is this important? Well, although the earlier DOMs were part of scripting languages, from the start of Navigator 4 and Internet Explorer 4, these browsers have increased the range and versatility of DHTML by including their own extended DOM versions in the browser code itself, which are sometimes referred to as DHTML Object Models. DHML Object Models allow you to reference a particular object the same way in any scripting language on a particular browser. However, because Netscape and Microsoft have developed different DOMs, you must reference some objects differently in Navigator 4 than Internet Explorer 4, respectively.

The hierarchy above is the basic structure of the DOM for Internet Explorer 4, which virtually makes all browser elements available to scripts. JavaScripting is one thing, but DHTML is another. DHTML is not just one technology but actually made up of three different technologies, CSS, HTML, and JavaScript. DHTML has come a long way and years ago browsers offered little support for CSS and only offered a few DOM extensions and browsers were limited. The combination of scripts and CSS allows you to add lag-free interacivity to your Web pages. Although the older browsers supported DHTML, they did so in a different way. Code used for most advanced DHTML features was different for each browser and required cross-browser code scripting. This often required a browser-detection script that I want to pass on to you if you ever need it.

<script language="javascript" type="text/javascript">

 

 

<!--

 

Nav4 = (document.layers) ? 1 : 0;

IE4 = (document.all) ? 1 : 0;

//-->

</script>

 

 

 

Much of the difference between browser support has to do with the lack of DHMTL standards. As the W3C organization refines and extends the industry standard, however, future browser releases should match more closely in how they support today's basic features. Nonetheless, the browser detection routine above may never become obsolete so long as end-users are still using older browsers. But this is becoming less and less when you take a look at the statistics for your company's Web site. In SharePoint this is not always a problem because of the rules and policies that the company has in place. The good thing is that it's becoming less and less work for a web page developer. Why? The internet browser has most definitely changed and it's come a long way. With the advent of jQuery, it's changed for the better and with HTML5 and the new CSS3 around the corner, it's going to get very interesting.

 

This section of articles will focus on all of the latest technologies related to web design and those parts that SharePoint is using because once again, SharePoint is web development.

 


How would you rate this article?

User Feedback

Post your comment
Name:
E-mail:
Comment:
Insert Cancel

Copyright © 2013 Jose M. Tamez
Last Updated August 18th 2013