Documente Academic
Documente Profesional
Documente Cultură
Tehnologii Web
procesare manual
e.g., expresii regulate
procesare obiectual
DOM (Document Object Model)
non-DOM
procesare simplificat
Simple XML
procesare particular
via API-uri specializate pentru a prelucra
tipuri de documente specifice e.g., RSS, SOAP, SVG,
fr validare
verific doar dac documentul
este bine-formatat (well formed)
Expat, libxml, MSXML,...
cu validare
verific dac documentul este valid,
conform unei metode de validare e.g., DTD
Apache Xerces, JAXP, libxml, MSXML,...
introducere
interfee DOM
DOM Core
DOM nivelul 2
DOM nivelul 3
DOM nivelul 4
implementri
DOM direct n navigator
Modelul DOM
Scop:
procesarea obiectual standardizat
a documentelor XML i/sau HTML
dom: intro
dom: caracterizare
dom: caracterizare
dom: caracterizare
DOM 1 (1998)
http://www.w3.org/TR/REC-DOM-Level-1/
DOM Core pentru XML
DOM HTML pentru procesarea standardizat
a paginilor Web uzual, la nivel de client (browser)
DOM 2 (2001)
http://www.w3.org/TR/REC-DOM-Level-2/
recomandri multiple privind diverse funcionaliti:
spaii de nume, aplicare de stiluri,
rspuns la evenimente etc.
DOM 3 (2004)
http://www.w3.org/TR/DOM-Level-3-Core/
funcionaliti specifice oferite de module
(unele deja standardizate)
XPath, traversare, validare,
ncrcare i salvare (asincrone),
DOM 4 (2015)
http://www.w3.org/TR/dom/
restructurarea unor interfee + noi funcionaliti
dom: interfee
dom: interfee
dom: interfee
dom: interfee
Short
UShort
Long
ULong
valori de
baz
Float
reale
Double
Boolean
tipuri de date
IDL
Char
altele
String
Struct
valori
construite
Enum
Sequence
Union
referin
Any
ntregi
metod cu un parametru;
rezultat: o valoare de tip Node
interface NodeList {
Node item (in unsigned long index);
readonly attribute unsigned long length;
};
proprietate read-only
de tip ntreg lung fr semn
dom: core
dom: core
Accesul la date
liste de noduri, atribute, valori,
se realizeaz recurgndu-se la metodele specifice
fiecrui tip de noduri ale arborelui
dom: core
Document
Element, ProcessingInstruction,
Comment, DocumentType
Document
Fragment
Element, ProcessingInstruction,
Comment, Text, CDATASection,
Element
Attr
Text, EntityReference
Text
Interfee fundamentale:
DOMException
dom: core
Interfee fundamentale:
DOMImplementation
dom: core
Interfee fundamentale:
DocumentFragment : Node
acces la fragmente de arbore
dom: core
Interfee fundamentale:
Document
ofer acces la document
pentru consultare i/sau modificare
dom: core
Interfee fundamentale:
Document
proprieti
doctype, implementation, documentElement
dom: core
Interfee fundamentale:
Document
proprieti
doctype, implementation, documentElement
acces la
elementul-rdcin
dom: core
Interfee fundamentale:
Document
metode createElement(), createTextNode(),
createAttribute(), getElementsByTagName(),
getElementById(),
createElementNS(), importNode(),
getElementsByTagNameNS(), renameNode() etc.
DOM 2
DOM 3
dom: core
Interfee fundamentale:
Node
acces la nodurile arborelui
dom: core
Interfee fundamentale:
Node
proprieti nodeName, nodeValue
dom: core
Interfee fundamentale:
Node
metode getNodeType(), insertBefore(),
appendChild(), replaceChild(), removeChild(),
cloneChild(), hasChildNodes(),
hasAttributes(), isSameNode()
DOM 2
DOM 3
dom: core
Interfee fundamentale:
Element
ofer acces la elementele XML
dom: core
Interfee fundamentale:
Element
proprietatea tagName
dom: core
Interfee fundamentale:
Element
metode getAttribute(), getAttributeNode(),
setAttributeNode(), removeAttributeNode(),
hasAttribute(), hasAttributeNS(),
DOM 2
dom: core
Interfee fundamentale:
Attr : Node
acces la atributele unui element
dom: core
Interfee fundamentale:
NodeList
NamedNodeMap
permit accesul la colecii de noduri
via indeci ori chei
dom: core
dom: html
};
dom: html
dom: html
HTML
HtmlElement
HTML
BodyElement
HTML
ParagraphElement
Text
HTML
DivElement
HTML
ImageElement
<!DOCTYPE html>
<html>
<body>
<p>Tehnologii Web</p>
<div>
<img src="web.png"/>
</div>
</body>
</html>
HTML
HtmlElement
HTML
BodyElement
HTML
ParagraphElement
Text
HTML
DivElement
HTML
ImageElement
<!DOCTYPE html>
<html>
<body>
<p>Tehnologii Web</p>
<div>
<img src="web.png"/>
</div>
</body>
</html>
Aspecte specifice:
innerHTML
proprietate mutabil ce furnizeaz codul (X)HTML
din cadrul unui nod de tip Element
utilizare
nerecomandabil
dom: html
Aspecte specifice:
textContent
proprietate ce furnizeaz/stabilete coninutul textual
al nodului i posibililor descendeni
dom: html
dom: nivelul 2
dom: nivelul 2
avansat
dom: nivelul 2
Tratarea evenimentelor
definirea de activiti (callback-uri) executate
la apariia unui eveniment
dom: nivelul 2
Tratarea evenimentelor
descrierea arborescent a fluxului de evenimente
capture versus bubble
dom: nivelul 2
Tratarea evenimentelor
descrierea arborescent a fluxului de evenimente
tratarea evenimentului se poate face pornind
de la rdcin pn la obiectul-int capture phase
dom: nivelul 2
Tratarea evenimentelor
descrierea arborescent a fluxului de evenimente
tratarea evenimentului poate avea loc atunci cnd
evenimentul e propagat de la obiectul unde a survenit
pn la entitile superioare lui bubbling phase
dom: nivelul 2
http://coding.smashingmagazine.com/2013/11/12/an-introduction-to-dom-events/
Tratarea evenimentelor
se va utiliza un set standard de evenimente
detalii la http://www.w3.org/TR/DOM-Level-2-Events
dom: nivelul 2
Tratarea evenimentelor
de interfa e.g., interaciunea cu utilizatorul
dom: nivelul 2
Tratarea evenimentelor
dom: nivelul 2
avansat
Tratarea evenimentelor
dom: nivelul 2
avansat
Tratarea evenimentelor
dom: nivelul 2
Tratarea evenimentelor
sunt puse la dispoziie interfeele:
EventTarget
EventListener
Event UIEvent, MouseEvent, TouchEvent
dom: nivelul 2
http://abstrusegoose.com/432
avansat
dom: nivelul 2
dom: nivelul 3
http://www.w3.org/TR/DOM-Level-3-Core
dom: nivelul 3
dom: nivelul 3
avansat
dom: nivelul 3
avansat
dom: nivelul 3
avansat
dom: nivelul 3
avansat
dom: nivelul 3
avansat
dom: nivelul 4
avansat
dom: nivelul 4
avansat
dom: nivelul 4
avansat
dom: nivelul 4
avansat
Selectors API
dom: nivelul 4
selectori
CSS3
avansat
dom: implementri
Expat procesor XML cu suport pentru diverse metode de
prelucrare (DOM, SAX etc.): http://expat.sourceforge.net/
(C, C++, Lua, .NET, Objective-C, Perl, Python, Ruby, Tcl)
HXT (Haskell XML Toolbox): procesri DOM n Haskell
www.haskell.org/haskellwiki/HXT
JAXP parte integrant din J2SE (javax.xml.*)
https://docs.oracle.com/javase/tutorial/jaxp/
dom: implementri
dom: implementri
avansat
avansat
Dr. Sabin Buragawww.purl.org/net/busaco
docum.
XML
HTML
dom: implementri
try {
$doc = new DomDocument; // instaniem un obiect DOM
$doc->load ("projects.xml"); // ncrcm documentul XML
// afim informaii privitoare la proiecte: titlul & clasa (dac exist)
$projs = $doc->getElementsByTagName("project");
foreach ($projs as $proj) { // prelum nodurile-element <title>
$titles = $proj->getElementsByTagName("title");
foreach ($titles as $title) {
echo "Proiect: " . $title->nodeValue;
}
// verificm dac exist specificat clasa proiectului
if ($proj->hasAttribute("class")) {
echo " de clasa " . $proj->getAttribute("class");
}
}
} catch (Exception $e) {
procesri DOM
die ("Din pcate, a survenit o excepie.");
}
n limbajul PHP
try:
doc = urllib.urlopen('projects.xml') # ncrcm documentul
dom = parse(doc)
# l procesm
# parcurgem elementele <project> i oferim informaii despre fiecare
for proiect in dom.getElementsByTagName('project'):
print 'Proiectul ' + proiect.childNodes[1].firstChild.nodeValue + \
' este de clas: ' + proiect.getAttribute('class')
except Exception:
print 'Din pcate, a survenit o excepie.'
procesri DOM
# instaniem procesorul XML
n limbajul Perl
$parser = new XML::DOM::Parser;
# procesm documentul
$doc = $parser->parsefile ('projects.xml');
$proiecte = $doc->getElementsByTagName ('project');
$nr_proiecte = $proiecte->getLength;
$proiecte_clasaS = 0;
# iniial, 0 proiecte de clas 'S'
for (my $i = 0; $i < $nr_proiecte; $i++) { # baleim toate proiectele
$proiect = $proiecte->item ($i);
# prelum clasa proiectului
$clasa = $proiect->getAttributeNode ('class')->getValue;
if ($clasa eq 'S') {
$proiecte_clasaS++;
}
}
print "\nSunt $proiecte_clasaS proiecte de clas S.\n";
$doc->dispose ();
# eliberm memoria
n C# (.NET)
try {
doc = new XmlDocument(); // instaniem un document XML
doc.Load("projects.xml"); // pentru a fi ncrcat
// afim informaii privitoare la proiecte: titlu i clas
XmlNodeList projs = doc.GetElementsByTagName("project");
foreach (XmlElement proj in projs) {
// selectm nodurile <title> via o expresie XPath
XmlNodeList titles = proj.SelectNodes("./title");
foreach (XmlElement title in titles) {
Console.Write("Proiect: {0} ", title.InnerXml);
}
if (proj.HasAttribute("class") == true) { // exist clasa specificat?
Console.WriteLine("de clasa '{0}'.", proj.GetAttribute("class"));
}
} catch ( Exception e ) {
// din pcate, a survenit o excepie
procesri DOM
}
dom: browser
dom: browser
dom: browser
recurgerea la
createElement()
appendChild()
getElementById()
avansat
vezi cursurile
viitoare
dom: browser
rezumat
modelul DOM:
caracterizare, niveluri de specificare, exemple
Instanierea
handler-elor
Procesor
SAX
notificare
apariie eveniment
nceput de tag
apelare handler
apariie eveniment
final de tag
apelare handler
etc.
Procesare
trimite
evenimente
SAX
<projects>
<project class="S">
</project>
</projects>
Aplicaie
client
episodul viitor:
procesri XML via SAX + prelucrri simplificate