Unit 2 dhtml

Unit 2 dhtml

• 1.
  DHTML
• 2.
  What is DHTML? DHTMLstands for dynamic hypertext transfer markup language. DHTML is not a language. DHTML is a term describing the art of making dynamic and interactive web pages. DHTML is the combination of several built-in browser features in fourth generation browsers that enable a web page to be more dynamic. (used to create dynamically changing websites)
• 3.
  It uses ahost of different technologies - JavaScript, VBScript, the Document Object Model (DOM), layers, cascading stylesheets - to create HTML that can change even after a page has been loaded into a browser. DHTML is NOT a scripting language (like JavaScript or VBscript), but a browser feature- or enhancement- that makes the browser dynamic
• 4.
  What is DHTML? Itis considered to be made up of –HTML –Cascading Style Sheets (CSS) –Scripting language(java script) All three of these components are linked via Document Object Model (DOM) DOM is the interface that allows scripting languages to access the content, style, and structure of the web documents and change them dynamically
• 5.
   Advantages ofDHTML DHTML will be a standard No plug-ins necessary Costly editing tools Only new browser support DHTML (Netscape 4.0 or higher and internet explorer IE 4.0 or higher version)
• 6.
  Disadvantages of DHTML Longand complex coding Browser support problem Unprotected source code
• 7.
  Tools of DTHML HTMLand XML –Partitions and Organizes the content CSS –Defines the Presentation of the content Scripting - JavaScript, JScript, VBScript –Adds interactivity to the page DOM- Document Object Model –Defines what and how elements are exposed for script access
• 8.
  Components of DHTML DHTMLrequires four independent components to work: HTML, Cascading Style Sheets, Scripting and the Document Object Model. The section provides a brief description of each component. 1.HTML: HTML defines the structure of a Web page, using such basic elements as headings, forms, tables, paragraphs and links. 2. Cascading Style Sheets (CSS): A style sheet controls the formatting of HTML elements. Like in traditional desktop publishing, one can use style sheet to specify page margins, point sizes and leading. Cascading Style Sheets is a method to determine precedence and to resolve conflicts when multiple styles are used.
• 9.
  3. Scripting: Scripting providesthe mechanisms to interpret user actions and produce client-side changes to a page. For example, scripts can interpret mouse actions (such as the mouse passing over a specified area of a page through the event model) and respond to the action by using a set of predefined instructions (such as highlighting the text activated by the mouse action). Although DHTML can communicate with several scripting languages, JavaScript is the de facto standard for creating cross-browser DHTML pages. 4. Document Object Model (DOM): The DOM outlines Web page content in a way that makes it possible for HTML elements, style sheets and scripting languages to interact with each other. The document can be further processed and the results of that processing can be incorporated back into the presented stage."
• 10.
  DOM – DocumentObject Model
• 11.
  DOM Introduction  DynamicHTML object model – “The Document Object Model (DOM) is an application programming interface (API) for HTML and XML documents. It defines the logical structure of documents and the way a document is accessed and manipulated.” – Great control over presentation of pages • Access to all elements on the page – Whole web page (elements, forms, frames, tables, etc.) represented in an object hierarchy – “Anything found in an HTML or XML document can be accessed, changed, deleted, or added using the Document Object Model, with a few exceptions.”
• 12.
  DOM-Document Object Model… The Document Object Model is a platform- and language-neutral interface that will allow programs and scripts to dynamically access and update the content, structure and style of the document The DOM details the characteristic properties of each element of a Web page, thereby detailing how we might manipulate these components and, in turn, manipulate the page
• 13.
  Document Object Modelis not a "part" of Scripting languages. The DOM stands alone, able to be interfaced with any programming language designed to do so DOM-Document Object Model…
• 14.
  DOM Example document node Document_typenode <!DOCTYPE> element node <HTML> element node <HEAD> element node <TITLE> text node "Sample" element node <BODY> element node <P> text node "This is a..."
• 15.
  Browser Specific Technologies Netscape  JavaScript Style Sheets  Netscape layers (CSS prototypes)  Microsoft  ActiveX (GUI objects)  Visual Filters (visual effects on graphics and text)  Cross Browser Technologies  Cascading style sheets (CSS)  JavaScript  Document Object Model (DOM) (connect window objects to scripts)
• 16.
  Types of scripting Server Side scripting:  Program is executed on the server and the results returned in a web page  Client Side scripting:  Program is executed in the computer of the web page visitor. The server is not accessed.