Flamingo.Selector.get()¶
The get() method is used to get nodes by the CSS selector.
Syntax¶
Flamingo.Selector.get(selector, parent)
Parameters¶
Parameter | Type | Description |
---|---|---|
selector | String | CSS selector. |
parent | Node object | Context node against which the specified CSS selector will be executed. |
Return Value¶
Type | Description |
---|---|
Array | Array of HTMLElement objects found by the CSS selector. |
Example 1¶
The example below demonstrates how to display all values of LI elements.
Source HTML code available on your original desktop site page:
<html>
<body>
<ul>
<li>List item 1</li>
<li>List item 2</li>
</ul>
</body>
</html>
You need to add the following code to your template to display all values of LI elements available on your page:
<!--{foreach Flamingo.Selector.get('li') as item }-->
Value is: <!--{= Flamingo.Selector.value('.', item) }--><br/>
<!--{/foreach}-->
The result for the sample page will look like:
Value is: List item 1
Value is: List item 2
Example 2¶
The example below demonstrates how to display all URLs used in a list.
Source HTML code available on original desktop site page:
<html>
<body>
<ul>
<li><a href="http://www.site1.com">List item 1</a></li>
<li><a href="http://www.site2.com">List item 2</a></li>
</ul>
</body>
</html>
You need to add the following code to your template to display all URLs used in the list:
<!--{foreach Flamingo.Selector.get('li > a') as item }-->
URL is: <!--{= Flamingo.jQ(item).attr('href') }--><br/>
<!--{/foreach}-->
The result will look like:
URL is: http://www.site1.com
URL is: http://www.site2.com
Example 3¶
The example below demonstrates how to add a CSS class to the list.
Source HTML code available on original desktop site page:
<html>
<body>
<ul>
<li><a href="http://www.site1.com">List item 1</a></li>
<li><a href="http://www.site2.com">List item 2</a></li>
</ul>
</body>
</html>
You need to add the following code to your template to apply a CSS style called custom-class to the list:
<!--{
var list = Flamingo.jQ('ul').clone(true);
list.addClass('custom-class');
Flamingo.output(list);
}-->
<!--{= list[0].outerHTML}-->
The HTML code of the resulting page will look like:
<html>
<body>
<ul class="custom-class">
<li><a href="http://www.site1.com">List item 1</a></li>
<li><a href="http://www.site2.com">List item 2</a></li>
</ul>
</body>
</html>
Example 4¶
The example below demonstrates how to add the target=”_blank” attribute to each link in the list.
Source HTML code available on original desktop site page:
<html>
<body>
<ul>
<li><a href="http://www.site1.com">List item 1</a></li>
<li><a href="http://www.site2.com">List item 2</a></li>
</ul>
</body>
</html>
You need to add the following code to your template to add the target=”_blank” attribute to each link in the list:
<--{
var links = Flamingo.jQ('a').clone(true);
links.attr('target', '_blank');
Flamingo.output(links);
}-->
The HTML code of the resulting page will look like:
<html>
<body>
<ul>
<li><a href="http://www.site1.com" target="_blank">List item 1</a></li>
<li><a href="http://www.site2.com" target="_blank">List item 2</a></li>
</ul>
</body>
</html>
See also