Академический Документы
Профессиональный Документы
Культура Документы
Fall2009
CSCI3110AdvancedTopicsinWebDevelopment
WhatistheDocumentObjectModel(DOM)?
Modelsdocument(XHTML,XML,etc.)ina hierarchicalstructure. All Allows programmatic ti parsing i and dchanging h i of fth the document. Multiple"methodsofattack"ofvaryingcomplexity.
10/5/2009
DOMHTMLrepresentation
<html> <head> <title>Hello</hello> <body> <p>Hithere!</p> </body> </html>
Document Element:html El Element: t head h d Element:title Text:Hello Element:body Element:p Text:Hithere!
Nodes
Adocumentisacollectionofnodesofvaryingtype. Nodescancontainothernodes. <pstyle="special">This l " i l" hi is i text.</p> / ElementnodeXHTMLtag Textnodetextualcontentofdocument.Contained withinelementnodes. Attributenodeprovides providesmoreinformationabout anelement.
10/5/2009
documentmethods
document.getElementById(id) allowsreferenceto anyelementinapagebyusingtheIDassignedto theelement element.
ID'smustbeuniqueinXHTML. NotauniversalsolutionasunwieldytoIDeverything.
getElementsByTagName
document.getElementsByTagName(tag) returnsan array ofelementsthatuseaparticulartag.
E ifonly Even l oneelement, l t still tillreturned t dasanarray.
http://einstein.etsu.edu/~pittares/CSCI3110/examples/81.htm
10/5/2009
Workingwithelements
element.getAttribute(attribute)returnsattribute valuefortheelement
http://einstein etsu edu/~pittares/CSCI3110/examples/83.htm http://einstein.etsu.edu/~pittares/CSCI3110/examples/8 3 htm
element.setAttribute(attribute,value)sets/resets theattributevaluefortheelement
http://einstein.etsu.edu/~pittares/CSCI3110/examples/84.htm http://einstein.etsu.edu/~pittares/CSCI3110/examples/85.htm
http://webbugtrack.blogspot.com/2007/08/bug242setattributedoesntalwayswork.html
Workingwithelements
Anelementnode'stextcanbereadandmodified usingtheinnerHTML property.
http://einstein etsu edu/~pittares/CSCI3110/examples/86.htm http://einstein.etsu.edu/~pittares/CSCI3110/examples/8 6 htm
10/5/2009
Workingwithelements
InthecontextofDOM,anelementisanobject.It mayormaynothaveatoString methoddefined.
http://einstein.etsu.edu/~pittares/CSCI3110/examples/8 http://einstein etsu edu/~pittares/CSCI3110/examples/88.htm 8 htm http://einstein.etsu.edu/~pittares/CSCI3110/examples/89.htm
Noderelationships
Allnodesinadocumentarerelated. Relationshiptypes:
Child Parent Sibling
Thislist Thi li tcontains t i all llt typesof fnodes, d not tjust j telement l t nodes.
http://einstein.etsu.edu/~pittares/CSCI3110/examples/811.htm
10/5/2009
NodeProperties
EverynodehasapropertynamednodeType. nodeType isanintegerasfollows.
1for f element l tnodes d 2forattributenodes 3fortextnodes
Changingatextnodeproperty
nodeObject.nodeValue ="newtext";
Foratagthatcontainstext,thefirstchildofthattag's elementnodeisthetext. text
http://einstein.etsu.edu/~pittares/CSCI3110/examples/812.htm http://einstein.etsu.edu/~pittares/CSCI3110/examples/813.htm
10/5/2009
Addingnewelements
Newelementscanbeaddedtoadocumentby creatinganewelements,buildingitscontents,and addingitwhereappropriateinthedocument hierarchy.
element.appendChild(element)
http://einstein.etsu.edu/~pittares/CSCI3110/examples/815.htm
Events
DOMeventscanbeaddedtoelements:
http://en.wikipedia.org/wiki/DOM_events
10/5/2009
documentarrays
Thedocumentobjectcontainsarrays(asproperties) toeachaccesstocertainpageelements: d document.anchors t h all llnamed danchors h within ithi a document document.formsallformswithinadocument document.imagesallimageswithinadocument document.linksall allhyperlinkswithinadocument
http://einstein.etsu.edu/~pittares/CSCI3110/examples/818.htm
documentproperties
Thedocumentobjectcontainspropertiestoeach accesstocertainpageelements: bodyreference e e e cetobodyelement ee e t cookiesets/readscookiesassociatedwithdocument domaindomainnameforcurrentdocument lastModifieddate/timedocumentlastmodified referrerURLthatreferredtocurrentdocument titletitleofcurrentdocument URLURLofcurrentdocument
http://einstein.etsu.edu/~pittares/CSCI3110/examples/819.htm http://einstein.etsu.edu/~pittares/CSCI3110/examples/820.htm
10/5/2009
Copyrights
PresentationpreparedbyandcopyrightofDr.Tony Pittarese,EastTennesseeStateUniversity,Computerand InformationSciencesDept.(pittares@etsu.edu) Podcastlecturerelatedtothispresentationavailablevia ETSUiTunesU.
Microsoft,Windows,Excel,Outlook,andPowerPointareregisteredtrademarksofMicrosoftCorporation. IBM,DB2,DB2UniversalDatabase,Systemi,Systemi5,Systemp,Systemp5,Systemx,Systemz,Systemz10,Systemz9,z10,z9,iSeries,pSeries, xSeries,zSeries,eServer,z/VM,z/OS,i5/OS,S/390,OS/390,OS/400,AS/400,S/390ParallelEnterpriseServer,PowerVM,PowerArchitecture,POWER6+, POWER6,POWER5+,POWER5,POWER,OpenPower,PowerPC,BatchPipes,BladeCenter,SystemStorage,GPFS,HACMP,RETAIN,DB2Connect,RACF, Redbooks,OS/2,ParallelSysplex,MVS/ESA,AIX,IntelligentMiner,WebSphere,Netfinity,TivoliandInformixaretrademarksorregisteredtrademarksof IBMCorporation. LinuxistheregisteredtrademarkofLinus Torvalds intheU.S.andothercountries. OracleisaregisteredtrademarkofOracleCorporation. HTML,XML,XHTMLandW3CaretrademarksorregisteredtrademarksofW3C,WorldWideWebConsortium,MassachusettsInstituteofTechnology. JavaisaregisteredtrademarkofSunMicrosystems, Microsystems Inc Inc. JavaScriptisaregisteredtrademarkofSunMicrosystems,Inc.,usedunderlicensefortechnologyinventedandimplementedby Netscape. SAP,R/3,SAPNetWeaver,Duet,PartnerEdge,ByDesign,SAPBusinessByDesign,andotherSAPproductsandservicesmentionedhereinaswellastheir respectivelogosaretrademarksorregisteredtrademarksofSAPAGinGermanyandothercountries. BusinessObjectsandtheBusinessObjectslogo,BusinessObjects,CrystalReports,CrystalDecisions,WebIntelligence,Xcelsius,andotherBusiness ObjectsproductsandservicesmentionedhereinaswellastheirrespectivelogosaretrademarksorregisteredtrademarksofBusinessObjectsS.A.inthe UnitedStatesandinothercountries.BusinessObjectsisanSAPcompany. ERPsim isaregisteredcopyrightofERPsim Labs,HECMontreal. Otherproductsmentionedinthispresentationaretrademarksoftheirrespectiveowners.