Unable to get CSS selector to work within XML document

[Bryan Garaventa]

Hi,

I’ve been trying to get this to work for hours now and it’s driving me sort of nuts.

 

Can you help me with the syntax for returning an element array of an XML document, starting with the XML document itself?

 

For instance I have a standard XML document of nodeType=9, and the XML structure is as follows:

 

<?xml version="1.0" encoding="UTF-8" ?>

<carousel>

<group name="Name1" >

<slide></slide>

</group>

<group name="Name2" >

<slide></slide>

</group>

</carousel>

 

I’m trying to get MooTools to return an array of just the first two firstChild nodes using the CSS selector “carousel > *”

 

Nothing works though.

 

Do you know how this can be done?

 

Thanks,

Bryan

 

 

[Sérgio Crisóstomo]

Bryan, please add more info about what you are doing. 

You can insert the "responseText" into HTML and use selector on that. 

Something like this: https://jsfiddle.net/kqyp1c39/

Cheers

--

---
You received this message because you are subscribed to the Google Groups "MooTools Users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to mootools-user...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[Andreas]

This code works for me

console.log($$('carousel > *'));

If it doesn't help please show a link to the page.

[Bryan Garaventa]

This is complicated, basically what I’m working on is an API, it takes variable content when XML is involved and parses it across various libs such as jQuery, Dojo, and MooTools so the same accessible widgets work across them all equally.

 

I’m having a lot of trouble with MooTools at the moment, because it doesn’t appear to be possible to keep XML DOM nodes as type text/xml when using CSS selectors to query nodes within these containers, making it impossible to then use standard XML DOM traversal methods to access section content contained within CDATA sections, unlike jQuery and Dojo that maintain these DOM node types.

 

This is making it impossible for me to get MooTools to process the same code reliably for the same widget types.

 

To give you an example.

 

This is a carousel Powered by jQuery which works

http://whatsock.com/tsg/Coding%20Arena/Carousels,%20Slideshows,%20and%20Wizards/Carousel%20(Flat%20from%20XML%20with%20Overrides)/demo.htm

 

This is the same code powered by Dojo which also works

http://whatsock.com/tsg/dojo/Coding%20Arena/Carousels,%20Slideshows,%20and%20Wizards/Carousel%20(Flat%20from%20XML%20with%20Overrides)/demo.htm

 

Here is the same code powered by MooTools that does not work in FF or Chrome because of this issue.

http://whatsock.com/tsg/mootools/Coding%20Arena/Carousels,%20Slideshows,%20and%20Wizards/Carousel%20(Flat%20from%20XML%20with%20Overrides)/demo.htm

 

For returned XML DOM nodes, it should be possible to access content contained within CDATA sections using standard XML Core DOM methods

(http://www.w3.org/TR/REC-DOM-Level-1/level-one-core.html#ID-667469212

http://www.w3schools.com/xml/dom_cdatasection.asp )

 

So the way it works in the code, it is it queries the following XML file, pulls out an array of ‘slide’ nodes, which it should then be possible to extract the CDATA content using the following syntax:

 

cdataContent = slideNode.childNodes[0].nodeValue;

 

This works in jQuery and MooTools because these nodes are still XML DOM nodes, but this doesn’t seem to work the same in MooTools, which is what I’m stuck on at the moment.

 

[XML file]

 

<?xml version="1.0" encoding="UTF-8" ?>

<carousel role="Carousel" accStart="Start" accEnd="End" height="170" width="280" className="carouselCls" prevTitle="Previous" nextTitle="Next" slideName="Slide" groupName="Group" showGroup="yes" groupPosTop="yes" btnPText="&#8592;" btnNText="&#8594;" btnPGText="&#8656;" btnNGText="&#8658;" isGrouped="yes" btnPAccesskey="1" btnNAccesskey="2" btnPGAccesskey="3" btnNGAccesskey="4" direction="lr" cycle="yes" timer="5000" animDelay="2000" forward="yes" hiddenMsg="Press Escape to stop automatic cycling" >

<group name="Alternative Rock" >

<slide announce="Emiliana Torrini - Love in the Time of Science" ><![CDATA[

<img src="img/music/ar_et_lts.jpg" alt="Emiliana Torrini - Love in the Time of Science" title="Emiliana Torrini - Love in the Time of Science" />

]]></slide>

<slide announce="Frente - Labour of Love" ><![CDATA[

<img src="img/music/ar_f_ll.jpg" alt="Frente - Labour of Love" title="Frente - Labour of Love" />

]]></slide>

<slide announce="Hooverphonic - Blue Wonder Power Milk" ><![CDATA[

<img src="img/music/ar_h_bwpm.jpg" alt="Hooverphonic - Blue Wonder Power Milk" title="Hooverphonic - Blue Wonder Power Milk" />

]]></slide>

<slide announce="New Order - Substance" ><![CDATA[

<img src="img/music/ar_no_s.jpg" alt="New Order - Substance" title="New Order - Substance" />

]]></slide>

<slide announce="U2 - The Unforgettable Fire" ><![CDATA[

<img src="img/music/ar_u_uf.jpg" alt="U2 - The Unforgettable Fire" title="U2 - The Unforgettable Fire" />

]]></slide>

</group>

<group name="Classical" >

<slide announce="Bach" ><![CDATA[

<img src="img/music/c_ba.jpg" alt="Bach" title="Bach" />

]]></slide>

<slide announce="Beethoven" ><![CDATA[

<img src="img/music/c_be.jpg" alt="Beethoven" title="Beethoven" />

]]></slide>

<slide announce="Chopin" ><![CDATA[

<img src="img/music/c_c.jpg" alt="Chopin" title="Chopin" />

]]></slide>

<slide announce="Mozart" ><![CDATA[

<img src="img/music/c_m.jpg" alt="Mozart" title="Mozart" />

]]></slide>

<slide announce="Vivaldi" ><![CDATA[

<img src="img/music/c_v.jpg" alt="Vivaldi" title="Vivaldi" />

]]></slide>

</group>

<group name="Rock" >

<slide announce="Guns N' Roses - Use Your Illusion 1" ><![CDATA[

<img src="img/music/r_gnr_uyi.jpg" alt="Guns N' Roses - Use Your Illusion 1" title="Guns N' Roses - Use Your Illusion 1" />

]]></slide>

<slide announce="Pearl Jam - Ten" ><![CDATA[

<img src="img/music/r_pj_t.jpg" alt="Pearl Jam - Ten" title="Pearl Jam - Ten" />

]]></slide>

<slide announce="Pink Floyd - Delicate Sound of Thunder" ><![CDATA[

<img src="img/music/r_pf_dst.jpg" alt="Pink Floyd - Delicate Sound of Thunder" title="Pink Floyd - Delicate Sound of Thunder" />

]]></slide>

<slide announce="Scorpions - Crazy World" ><![CDATA[

<img src="img/music/r_s_cw.jpg" alt="Scorpions - Crazy World" title="Scorpions - Crazy World" />

]]></slide>

<slide announce="Tom Petty - Full Moon Fever" ><![CDATA[

<img src="img/music/r_tp_fmf.jpg" alt="Tom Petty - Full Moon Fever" title="Tom Petty - Full Moon Fever" />

]]></slide>

</group>

</carousel>

[Bryan Garaventa]

Sorry, the following is a typo:

 

“This works in jQuery and MooTools because these nodes are still XML DOM nodes, but this doesn’t seem to work the same in MooTools, which is what I’m stuck on at the moment.”

 

I meant to say this works in jQuery and Dojo, but not in MooTools because of this.

 

If you can think of a fix for this, please let me know.

 

Thanks,

Bryan

[Bryan Garaventa]

Hi, so I’ve worked out a fix for this, which is to use querySelectorAll as a fallback which returns the requisite XML object nodes.

 

One quirk that I’ve noticed is that MooTools apparently inserts a Div element with an embedded A tag with id=”slick_uniqueid” every time my XML content is pulled in, so this is appearing in my firstChild node list within my XML DOM.

 

Do you know why it’s doing this?