dom structure
Post on 06-May-2015
160 Views
Preview:
TRANSCRIPT
Disclaimer: This presentation is prepared by trainees of baabtra as a part of mentoring program. This is not official document of baabtra –Mentoring PartnerBaabtra-Mentoring Partner is the mentoring division of baabte System Technologies Pvt . Ltd
WELCOME
Midhun sudhakarmidhusudhakaran@gmail.comMidhun.sudhakar.73@facebook.com twitter.com/midhunopusin.linkedin.com/pub/midhunsudhakar/86/a65/
a9b/Phonenumber
9995586182
DOM structure
Contents
• What is DOM?• DOM history• DOM nodes• Example.
What is DOM?
• Interface used for interacting with structure and content of a page.
• Defines the way a doc accessed and manipulated dynamically.
• From W3C.
Tree-Structure
DOM history
• DOM Level 1-1998• DOM Level 2-2000• DOM Level 3-2004• DOM Level 3(under process).
HTML DOM Node Tree (Document Tree)
All the nodes in a node tree have relationships to each other.
The tree structure is called a node-tree.
Node:- Parents, Children, and Siblings
DOM<html>
<head><title>DOM</title>
</head> <body>
<h1>I am in DOM world</h1> <p id=“intro”>Hello DOM!</p>
</body> </html>
• The <html> node, the root node• <body> Is Child of<head>• <p>is the parent "Hello world!"
DOM Properties and Methods
• A property is a value that you can get or set• A method is an action you can do
ex:<html>
<body>
<p id="demo"></p>
<script>document.getElementById("demo").innerHTML = "Hello World!";</script></body></html>
Node PropertyProperties Of node :
• nodeName:Returns name of element.
• nodeValue:Returns value of element.
•nodeType:Returns type of node whether element or document etc.
HTML DOM MethodsMethods Of node Interface:
• getElementByID(id)
• getElementsByTagName(name)
HTML DOM MethodsMethods Of Document Interface:
• createElement(tagName) :
• createTextNode(text) :
• createAttribute(attributeName) :
Javascript program to validate a registration form
CODE
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 StandMukkam, Kozhikode,Kerala, India.Ph: + 91 – 495 40 25 550
Cafit Square,Hilite Business Park,Near Pantheerankavu,Kozhikode
Start up VillageEranakulam,Kerala, India.
Email: info@baabtra.com
top related