Creare date XML - E4X in ActionScript 3

Curs Flash

XML (Extensible Markup Language) este un format special de structurare si stocare a datelor in fisiere cu extensia .xml cu o sintaxa bazata pe tag-uri, este ca o baza de date simpla in care datele sunt adaugate ierarhic in tag-uri, precum la HTML.

Ca o sintaxa simpla a unui cod in format XML este:

<?xml version="1.0"?>
<baza>
  <tag atribut="valoare">
    <tag_in atribut="valoare">Data stocata</tag_in>
  </tag>
</baza>

- Daca nu stiti ce face si cum se lucreaza cu documente XML, studiati tutorialul de la pagina Documente XML.

Formatul XML este in general folosit pentru stocarea de date cum ar fi adrese de imagini sau pagini, adrese si nume de fisiere audio/video si altele, care pot fi utilizate /prelucrate in ActionScript cu functiile specifice E4X, ale claselor XML si XMLList.
Datele in format XML pot fi utilizate in ActionScript prin preluarea lor dintr-un fisier extern sau create direct in script.

Creare date XML cu E4X

E4X este un "nickname" (un alt nume) folosit in ActionScript pentru XML in standardul ECMAScript. Este acelasi standard pentru acces XML folosit si in JavaScript 2.0.
Cu E4X in ActionScript 3 sunt mai multe variante de a crea date in format XML direct in codul scriptului.
Exista 2 optiuni principale:
    1. Prin scrierea directa a intregii structuri XML (tag-uri, atribute, ...) ca valoare a unei variabile de tip XML.
    2. Prin adaugarea separata a fiecarui element. Aici sunt doua modalitati: cu operatorul punct (.) si cu metode ale claselor XML, XMLList.
• In aceasta lectie vor fi prezentate fiecare din aceste modalitati. Ca regula generala, toate folosesc o instanta de obiect a clasei XML.
    - Un obiect XML reprezinta o portiune dntr-un format de date XML, precum: elemente (tag-uri), atribute, comentarii, text.
    - XMLList e o lista de obiecte /elemente XML, indexate numeric, ca un Array.

1. Sa luam un exemplu simplu in care e folosita prima varianta.

// Instanta XML cu datele XML complete
var poze:XML = <imglist>
    <image id="1">
      <url>dir/img1.jpg</url>
      <title>Titlu img1</title>
    </image>
  </imglist>;

trace(poze);        // Afiseaza in Output structura XML

- Acest cod creaza o structura de date XML, in variabila "poze", in care e stocata adresa si titlu unei imagini, iar pt. verificare, daca testati, "trace(poze)" afiseaza in Output aceasta structura.

• Datele in codul XML pot fi adaugate si prin variabile, astfel sunt mai usor de modificat si de folosit mai departe in script. Dar aceste variabile trebuie incadrate intre acolade, dupa cum e in exemplu urmator, ce creaza aceeasi structura de date XML ca cel de mai sus.

// Variabile cu date ce trebuie adaugate in XML
var img_id:int = 1;
var img_url:String = 'dir/img1.jpg';
var img_title:String = 'Titlu img1';

// Instanta XML cu datele XML complete
var poze:XML = <imglist>
    <image id={img_id}>
      <url>{img_url}</url>
      <title>{img_title}</title>
    </image>
  </imglist>;

trace(poze);        // Afiseaza in Output structura XML

2. Iata acelasi format XML creat prin adaugarea separata a fiecarui element, cu operatorul punct:

// Instanta XML cu tag-ul root (de baza)
var poze:XML = <imglist/>;        // Se poate si new XML(<imglist/>);
poze.image.@id = 1;         // Creaza tagul <image>, include si un atribut "id" cu valoare 1
poze.image.url = 'dir/img1.jpg';     // Adauga in tagul <image> un tag <url>
poze.image.title = 'Titlu img1';     // Adauga in tagul <image> un tag <title>

trace(poze);

- Acest cod creaza si returneaza in Output aceeasi structura XML ca cea de la primul exemplu.
Observati modalitatea de creare a fiecarui element, logica sintaxei e destul de simpla:
    - Tagul de baza, numit si radacina (root) se adauga la declararea instantei, cu forma <numetag/>
    - Celelalte tag-uri se creaza prin adaugarea lor la variabila cu instanta XML, sub forma ierarhica, separate cu notatia punct (.).
    - Atributul se adauga la fel, cu notatia punct, dupa tag-ul unde trebuie inclus, dar cu un caracter "@" in fata, ca sa fie recunoscut ca e un element atribut.

• O alta modalitate de a adauga elemente in structura XML este prin folosirea urmatoarelor metode din clasele XML, XMLList:

• appendChild(childObj) - adauga elementul "childObj" la sfarsitul celor din obiectul curent
• insertChildAfter(child1, child2) - adauga elementul "child2" dupa "child1" din obiectul XML curent
• insertChildBefore(child1, child2) - adauga elementul "child2" inaintea lui "child1" din obiectul XML curent
• prependChild(childObj) - adauga "childObj" la inceput in elementul XML la care e aplicata, inaintea oricaror alte elemente din acel obiect

- Aceasta abordare, prin metode, poate parea mai greu de inteles, dar este eficienta cand se doreste adaugarea unor date inainte sau dupa altele deja existente.
Iata acelasi format XML din exemplele de mai sus, de data aceasta creat prin utilizarea metodelor.

// Instanta XML cu tag-ul root (de baza)
var poze:XML = <imglist/>;

// Se adauga fiecare element in parte
// Tagul <image>, apoi, in el: <url> si <title>
poze.appendChild(<image id="1"></image>);
poze.image.prependChild(<url>dir/img1.jpg</url>);
poze.image.insertChildAfter(poze.image.url, <title>Titlu img1</title>);

trace(poze);

Se poate aplica oricare din aceste variante, sau combinate. Totusi, in general se folosesc date XML incarcate din fisier extern, deoarece acel fisier poate fi utilizat si cu alte aplicatii pe server (de ex. cu PHP).
Preluarea datelor XML din fisiere externe este prezentata intr-o lectie urmatoare.

Fisierul FLA cu exemplele din aceasta lectie poate fi descarcat de la: XML - E4X - creare.

Prima linie ...<br>
Alta linie...

#id {
  letter-spacing: 2px;
}

var elm = document.getElementById("theID");
var content = elm.innerHTML;
alert(content);

echo "Adresa URL: http://CoursesWeb.net";

She does not paint that landscape.
- Ea nu picteaza acel peisaj.

Ella no canta esa canción.
- Ea nu canta acel cantec.