Dom structure
Upcoming SlideShare
Loading in...5
×
 

 

Statistics

Views

Total Views
106
Views on SlideShare
106
Embed Views
0

Actions

Likes
0
Downloads
1
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Dom structure Dom structure Presentation Transcript

  • Dom Structure Arun .R. Menon arunrmenon555@gmail.com www.facebook.com/arunrmenon twitter.com/iamarunmenon in.linkedin.com/in/mearunmenon +919846629020
  • Disclaimer: This presentation is prepared by trainees of baabtra as a part of mentoring program. This is not official document of baabtra –Mentoring Partner Baabtra-Mentoring Partner is the mentoring division of baabte System Technologies Pvt . Ltd
  • DOM-DOCCUMENT OBJECT MODEL  A W3C (World Wide Web Consortium) standard. Defines a standard for accessing documents. Platform that allows programs and scripts to dynamically access and update the content, structure, and style of a document. The W3C DOM standard :3 different parts: Core DOM - standard model for all document types XML DOM - standard model for XML documents HTML DOM - standard model for HTML documents
  • DOM views HTML documents as a tree structure. All browsers are following DOM and because of this the JavaScript code will work on all the browsers in the same way.
  • HTML DOM TREE STRUCTURE
  • HIERARCHY OF OBJECTS
  • DOM PROGRAMMING INTERFACE The HTML DOM can be accessed with JavaScript All HTML elements are defined as objects. Programming interface: properties and methods of object. property : value that you can get or set. changing the content of an HTML element method : an action you can do add or deleting an HTML element.
  • EXAMPLE <html> <body> <p >WELCOME TO BAABTRA</p> <p id="demo"></p> <script> document.getElementById("demo").innerHTML = "Hello World!"; </script> </body> </html> getElementById: method access element using its id innerHTML: property to get the content of an element
  • METHODS USED TO FIND AN ELEMENT • document.getElementById() • document.getElementByTagName() • document.getElementByClassName()
  • METHODS USED FOR CHANGING AN ELEMENT • Element.innerHTML= • Element.attribute= • Element.setAttribute(attribute.value) • Element.style.property=
  • METHODS FORADDING AND DELETING ELEMENTS • document.createElement() • document.removeChild() • document.removeChild() • document.appendChild() • document.replaceChild() • document.write(text)
  • METHOD FOR ADDING EVENT HANDLERS document.getElementById(id).onclick=function(){code}
  • Code Output Program to validate customer registration form. If any field left blank corresponding label must be turned red and form should not get submitted.
  • THANK YOU...
  • Want to learn more about programming or Looking to become a good programmer? Are you wasting time on searching so many contents online? Do you want to learn things quickly? Tired of spending huge amount of money to become a Software professional? Do an online course @ baabtra.com We put industry standards to practice. Our structured, activity based courses are so designed to make a quick, good software professional out of anybody who holds a passion for coding.
  • Follow us @ twitter.com/baabtra Like us @ facebook.com/baabtra Subscribe to us @ youtube.com/baabtra Become a follower @ slideshare.net/BaabtraMentoringPartner Connect to us @ in.linkedin.com/in/baabtra Thanks in advance. www.baabtra.com | www.massbaab.com |www.baabte.com
  • Contact Us Emarald Mall (Big Bazar Building) Mavoor Road, Kozhikode, Kerala, India. Ph: + 91 – 495 40 25 550 NC Complex, Near Bus Stand Mukkam, Kozhikode, Kerala, India. Ph: + 91 – 495 40 25 550 Cafit Square, Hilite Business Park, Near Pantheerankavu, Kozhikode Start up Village Eranakulam, Kerala, India. Email: info@baabtra.com