Selectors in jQuery
If you’re familiar with jQuery you should already know what are selectors and how they work. However we’re used to get some DOM element with a specific selector, but actually sometimes you cannot select directly what you need. This is especially true when mixing more than one JavaScript libraries. In my case OpenLayers generated a vector layer and jQuery was supposed to change the vectors fill-color property.
With the simple $(‘path’) I easily got all vectors in the current document, but the problem was that I took them as text. Thus it came to me to use nested jQuery – $($(‘selector’));
To describe what actually happened in my case, let me show you a breve example.
Example
Here’s a short HTML markup:
<div><span>text text</span></div> |
With jQuery I can select both the DIV and SPAN with the simple $(‘div’) and $(‘span’), but just for the example lets assume I’ve only the inner text of the DIV tag:
$('div').html(); |
That was the case in the OpenLayers/jQuery problem. Now I can easily use another jQuery selector:
$($('div').html()); |
This will return the same as $(‘span’) – a jQuery object.