Scribd Logo
Upload

Welcome to Scribd!

  • What Is The Difference Between HTML 4.0 and HTML 5? Html5 Vs Html4

    Uploaded by

    Usman Shabbir
    37 views5 pages
    1) what is dom model 2) how dom model works 3) code of dom model

    Original Title

    What is the DOM

    Copyright

    © © All Rights Reserved

    Available Formats

    DOCX, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    1) what is dom model 2) how dom model works 3) code of dom model

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    37 views5 pages

    What Is The Difference Between HTML 4.0 and HTML 5? Html5 Vs Html4

    Uploaded by

    Usman Shabbir
    1) what is dom model 2) how dom model works 3) code of dom model

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    of 5

    What is the DOM?

    The Document Object Model (DOM) is a programming interface for web documents. It represents the
    page so that programs can change the document structure, style, and content. The DOM represents the
    document as nodes and objects; that way, programming languages can interact with the page.

    A web page is a document that can be either displayed in the browser window or as the HTML source. In
    both cases, it is the same document but the Document Object Model (DOM) representation allows it to
    be manipulated. As an object-oriented representation of the web page, it can be modified with a
    scripting language such as JavaScript.

    For example, the DOM specifies that the querySelectorAll method in this code snippet must return a list
    of all the <p> elements in the document:

    What is the difference between HTML 4.0 and HTML 5?

    Html5 vs Html4

    HTML5 is the next revision of the HTML standard superseding HTML 4.01. HTML5 is a standard for
    structuring and presenting content on the World Wide Web.

    HTML4

     It is 4th version of Html.


     It is older version of Html5, so have less features compared to html5.
     It does no provide better error handling like html5.
     In Html4 these supported provided by third party Silverlight and flash.
    HTML5

     It is extension of html4. it is 5th version of html.


     Html5 is very simple compared to html4.
     Html5 provides consistency in malformed documents. it has better error handling.
     Multimedia support provided by Html5.

    How DOM model works against HTML and XML?


    DOM model in XML

    The XML DOM makes a tree-structure view for an XML document.

    We can access all elements through the DOM tree.

    We can modify or delete their content and also create new elements. The elements, their content (text
    and attributes) are all known as nodes.

    For example, consider this table, taken from an HTML document:


    XML DOM Example : Load XML String

    This example parses an XML string into an XM DOM object and then extracts some information from it
    with a JavaScript.

    Let's see the HTML file that extracts the data of XML string using DOM.

    1. <!DOCTYPE html>  
    2. <html>  
    3. <body>  
    4. <h1>Important Note2</h1>  
    5. <div>  
    6. <b>To:</b> <span id="to"></span><br>  
    7. <b>From:</b> <span id="from"></span><br>  
    8. <b>Message:</b> <span id="message"></span>  
    9. </div>  
    10. <script>  
    11. txt1="<note>";    
    12. txt2="<to>Sania Mirza</to>";    
    13. txt3="<from>Serena William</from>";    
    14. txt4="<body>Don't forget me this weekend!</body>";    
    15. txt5="</note>";    
    16. txt=txt1+txt2+txt3+txt4+txt5;  
    17.   
    18. if (window.DOMParser)  
    19.   {  
    20.   parser=new DOMParser();  
    21.   xmlDoc=parser.parseFromString(txt,"text/xml");  
    22.   }  
    23. else // Internet Explorer  
    24.   {  
    25.   xmlDoc=new ActiveXObject("Microsoft.XMLDOM");  
    26.   xmlDoc.async=false;  
    27.   xmlDoc.loadXML(txt);  
    28.   }  
    29. document.getElementById("to").innerHTML=  
    30. xmlDoc.getElementsByTagName("to")[0].childNodes[0].nodeValue;  
    31. document.getElementById("from").innerHTML=  
    32. xmlDoc.getElementsByTagName("from")[0].childNodes[0].nodeValue;  
    33. document.getElementById("message").innerHTML=  
    34. xmlDoc.getElementsByTagName("body")[0].childNodes[0].nodeValue;  
    35. </script>  
    36. </body>  
    37. </html>  

    DOM model in HTML

    Document Object Model Is basically a map or model of a web page.  Its job is to describe the structure of
    an HTML document and the relationship between different elements like tags, attributes, and texts on a
    page. If we doing addition, deletion or modification in existing element on our website, so basically we
    are developing the structure of DOM. As a W3C specification, one important objective for the Document
    Object Model is to provide a standard programming interface that can be used in a wide variety of
    environments and applications. The Document Object Model can be used with any programming
    language.
    Every DOM obj. is different and It has its own “properties, events and functionality”. And every DOM
    obj. has its own Documentation, according to “DOM standard”. There are additional documented
    functions that can be used to manage an element. These are called the DOM API.
    There are three types of API’s which are specified by DOM Standard:

    <span style="font-size: 14pt;"><html>


     
    <body>
     
    <Table>
      <tr>
        <th>Firstname</th>
        <th>Lastname</th>
        <th>Gender</th>
      </tr>
      <tr>
        <td>Sameed</td>
        <td>Khan</td>
        <td>Male</td>
      </tr>
      </table>
     
    </body>
     
    </html></span>

    You might also like