Editing, Changing XML - E4X

Actionscript Course

Besides the posibility to create, load and access XML data, E4X also has functions to edit, change and delete the XML data in ActonScript.

Changing the Contents of an Element and an Attribute Value

The content of an element and the value of an attribute can be easily changed by accesing these elements with the dot (.) operator, when the structure of the XML content is well known.
Just access the respective element /attribute, and assign that element any new value (other than an XMLList or XML object). The value is converted to a string and replaces the element's content.
See this example:

// define an XML instance to store the XML content
var marplo:XML = <site>
    <courses>
      <course id="1" title="PHP-MySQL">https://coursesweb.net/php-mysql/</course>
      <course id="2" title="JavaScript">https://coursesweb.net/javascript/</course>
      <course id="3" title="Flash ActionScript">https://coursesweb.net/flash/</course>
    </courses>
  </site>;

// modify the content in the second tag <course> (in <courses>)
marplo.courses.course[1] = 'marplo.net/engleza/';

// Modify the "title" attribute in the second tag <course>
marplo.courses.course[1].@title = 'English Language';

// Verify if the data was changed
trace(marplo);

/* It will display:
  <site>
    <courses>
      <course id="1" title="PHP-MySQL">https://coursesweb.net/php-mysql/</course>
      <course id="2" title="Limba Engleza">marplo.net/engleza/</course>
      <course id="3" title="Flash ActionScript">https://coursesweb.net/flash/</course>
    </courses>
  </site>
*/

- See the comments in code.

• Tthe content of an element and the value of an attribute can also be changed using the methods of the XML class.
Here's the same changes to the XML content, but this time using XML class's methods.

// define an XML instance to store the XML content
var marplo:XML = <site>
    <courses>
      <course id="1" title="PHP-MySQL">https://coursesweb.net/php-mysql/</course>
      <course id="2" title="JavaScript">https://coursesweb.net/javascript/</course>
      <course id="3" title="Flash ActionScript">https://coursesweb.net/flash/</course>
    </courses>
  </site>;

// Add in a XMLList instance the element that will be modified
  // (it is easier when you work multiple times with the same element)
// the tag "course" in the first child of the root tag
var curss:XMLList = marplo.children()[0].child('course');

// Modify the content of the second element stored in the variable "curss" 
curss[1] = 'marplo.net/engleza/';

// Change the value of the 'title' attribute in the second element stored in the variable "curss"
curss[1].attribute("title")[0] = 'English Language';

// Verify if the data changed
trace(marplo);

- In Output panel will display the same result as the first example.

Either of these two options is good (the dot operator and @ character, or XML class methods), depends on how well the content and hierarchy of the XML format is known, as well as the context in which the modifications are made.
They can also be combined, for example:       marplo.*.child('course')[1].@title = 'English Language';

Adding new tags and attributes

When new tags must be added in a XML object, the XML class methods are usually used (or combined with the (.) operator), because the XML methods offer a better control over the place where the item is addded (before or after other existing elements in an object).
For attributes, if their order in the tag doesn't matter, they are added mostly by using the (.) dot operator and the character '@'.

in the following example we add a new <course> tag, at the beginning of the elements in <courses> (with the "prependChild()" method). Then, with a "for()" instruction we iterate over every <course> tags, and add to each one a "nr" attriburte (see the explanations in code).

// define an XML instance to store the XML content
var marplo:XML = <site>
    <courses>
      <course id="1" title="PHP-MySQL">https://coursesweb.net/php-mysql/</course>
      <course id="2" title="JavaScript">https://coursesweb.net/javascript/</course>
      <course id="3" title="Flash ActionScript">https://coursesweb.net/flash/</course>
    </courses>
  </site>;

// Create a new XML instance with the new "course" element, then add it in <courses>
var new_course:XML = <course id="0" title="HTML">marplo.net/html/</course>;
marplo.courses[0].prependChild(new_course);

// Add in a XMLList instance all the elements with the tags <course>
var curss:XMLList = marplo.courses[0].course;

// define a for() loop to iterate over every item in "curss"
for(var i:int=0; i<curss.length(); i++)
{
  // Add a "nr" attribute, with the value of "i"
  curss[i].@nr = i;
}

trace(marplo);

- In output displays the following XML format (notice the new <course> tag and the "nr" attribute):.
• The XML class's methods used to add new elements are:

• appendChild(childObj) - Appends the "childObj" to the end of the XML object's elements
• insertChildAfter(child1, child2) - Inserts the "child2" after the "child1" in an XML object and returns the resulting object
• insertChildBefore(child1, child2) - Inserts the "child2" before the "child1" in an XML object and returns the resulting object
• prependChild(childObj) - add "childObj" to the beginning of an XML object, before any existing elements for that object
• setChildren(XMLcode) - Replaces the content of the XML object with the "XMLcode" object.

Deleting elements and attributes

To delete elements and attributes from an XML object, use the delete operator as follows:

delete XMLobject.element_or_attribute

- For example:

delete xmlObj.elm[0];              // Delete the first tag <elm> in the root
delete xmlObj.elm[0].tag[1];       // Delete the second <tag> in the first <elm> in root
delete xmlObj.elm[0].@atr;         // Delete the "atr" attribute of the first tag <elm> in root
delete xmlObj.elm.tag.@atr;        // Delete the attribute "atr" of all the elements <tag> included in each <elm> in root
delete xmlObj.*;                   // Delete all the elements
delete xmlObj.*.tag.@*;            // Delete all the attributes of each element <tag>

In the following example we delete the last <course> tag and the "id" attribute from all the "course" elements.

// define an XML instance to store the XML content
var marplo:XML = <site>
    <courses>
      <course id="1" title="PHP-MySQL">https://coursesweb.net/php-mysql/</course>
      <course id="2" title="JavaScript">https://coursesweb.net/javascript/</course>
      <course id="3" title="Flash ActionScript">https://coursesweb.net/flash/</course>
    </courses>
  </site>;

// gets the number of <course> elements in <courses> (to know the index of the last element)
var nr_c:* = marplo.courses[0].course.length();

// Delete the last <course> tag (its index is [nr_c-1])
delete marplo.courses.course[nr_c-1];

// Delete the "id" attribute from all the <course> tags
delete marplo.courses.course.@id;

trace(marplo);

- After applying the delete instructions, the remained XML content (displayed in Output) is:
• The editing operations can be also combined with filtering instructions.
For example:
            delete marplo.courses.course.(hasOwnProperty('@id') && @id==2).*;
- Delete the content of the "course" element which has the attribute id="2".

The following instruction:
            marplo.*.course.(hasOwnProperty('@id') && @id==2).setChildren(<newtag>Text</newtag>);
- Replaces the content of the "course" element which has the attribte id="2" with "<newtag>Text</newtag>".

• To convert the XML data into a String object, use the toXMLString() method as folows:

ObiectXML.toXMLString()

- This method allows to use the XML content as a String.

• To convert a String with XML data into a XML object, add the string as argument to a new XML instance:

var ObiectXML:XML = new XML(stringXMLdata);

To download the FLA file with the examples from this lesson, click: Editing, Changing XML - E4X.

<ul>
 <li>http://coursesweb.net/html/</li>
 <li>http://coursesweb.net/css/</li>
</ul>

.some_class {
  display: list-item;
}

var obj = {
 "courses": ["php", "javascript", "ajax"]
};
var jsonstr = JSON.stringify(obj);
alert(jsonstr);    // {"courses":["php","javascript","ajax"]}

$strhtml = '<body><div id="dv1">CoursesWeb.net</div></body>';
$dochtml = new DOMDocument();
$dochtml->loadHTML($strhtml);
$elm = $dochtml->getElementById("dv1");
echo $elm->nodeValue;    // CoursesWeb.net