Rabbit.Selector.get()¶

The get() method is used to get nodes by the CSS selector.

Syntax¶

Rabbit.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 Rabbit.Selector.get('li') as item }-->
  Value is: <!--{= Rabbit.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 Rabbit.Selector.get('li > a') as item }-->
    URL is: <!--{= Rabbit.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 = Rabbit.jQ('ul').clone(true);
       list.addClass('custom-class');
       Rabbit.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 = Rabbit.jQ('a').clone(true);
       links.attr('target', '_blank');
       Rabbit.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>

参考