php-mysql tutorial

Designed By NISHANT GUPTA

  • Home
  • PHP
  • HTML
  • CSS
  • JavaScript
  • JQuery
  • Contact-us
  • Learn HTML

    • Introduction of HTML
    • Image Handling in HTML
    • List Handling in HTML
    • Font Handling in HTML
    • Table Handling in HTML
    • Form Handling in HTML
  • Learn CSS

    • Introduction of CSS
    • Styling Background in CSS
    • Styling Text in CSS
    • Styling Font in CSS
    • Styling Link in CSS
    • Styling List in CSS
    • Styling Table in CSS
    • Styling Div in CSS
    • Styling Span in CSS
    • Positioning in CSS
    • Display in CSS
  • Learn JavaScript

    • Introduction of JavaScript
    • Data Type in JavaScript
    • Variable in JavaScript
    • Oprator in JavaScript
    • Cond. Statement in JavaScript
    • Loop in JavaScript
    • Array in JavaScript
    • Function in JavaScript
    • Date in JavaScript
    • String in JavaScript
    • DOM in JavaScript
    • Event Handling in JavaScript
    • Form Handling in JavaScript
  • Learn PHP-MYSQL

    • Introduction of PHP
    • Decision Control in PHP
    • Loop in PHP
    • Array in PHP
    • Function in PHP
    • Form Handling in PHP
    • File Inclusion in PHP

DOM in JavaScript

DOM Introduction

  1. Javascript is mostly used to provide a means for our visitors to interact with our web page.
  2. In order to be able to do this we need to have some means by which our JavaScript program can access the component parts of the web page.
  3. This is done using DOM ( Document Object Model)

What Is DOM ?

  1. When a Web browser loads an HTML file, it displays the contents of that file on the screen.
  2. But that’s not all the Web browser does with the tags, attributes, and contents of the file: it also creates and memorizes a “model” of that page’s HTML.
  3. In other words, the Web browser remembers the HTML tags, their attributes, and the order in which they appear in the file—this representation of the page is called the Document Object Model, or DOM in short

     

Example(Human View)

<html>

  <head>

  <title>An Example XHTML Document</title>

  <link rel="stylesheet" href="style.css" type="text/css" />

  </head>

  <body>

  <p>This is an example paragraph.</p>

  <p>This is an example paragraph with

  <a href="stuff.html">a hyperlink</a> inside of it!</p>

  <p>And here's one with<br />a line break

  and an <img src="image.jpg" alt="image">.</p>

  </body>

</html>

Browser View

Explanation

  1. In the HTML DOM, everything is a node.
  2. •The entire document is a document node .
  3. •Every HTML element is an element node.
  4. The text inside HTML elements are text nodes.
  5. Every HTML attribute is an attribute node.

What Can Be Done With DOM ?

With DOM , a programmer  gets all the power he needs to create dynamic HTML:

  1. Using DOM we can can change all the HTML elements in the page.
    Using DOM we can can change  all the HTML attributes in the page.
  2. Using DOM we can can change all the CSS styles in the page.
  3. Using DOM we can can react to all the events in the page .

 

Advertisements

 

©  2014 All Rights Reserved  •  Design by >Nishant Gupta.

Privacy Policy • Terms of Use