Flamingo.Selector.get()

Метод get() используется для получения узлов с помощью CSS селектора.

Синтаксис

Flamingo.Selector.get(selector, parent)

Параметры

Параметр Тип Описание
selector String  CSS селектор.
parent Node объект  Контекстный узел, против которого будет выполнен указанный CSS селектор.

Возвращаемое значение

Тип Описание
Array  Массив объектов HTMLElement, найденных CSS селектором

Пример 1

Пример, приведенный ниже, показывает как отобразить все значения LI элементов.

Исходный HTML код, доступный на оригинальной странице сайта:

<html>
 <body>
   <ul>
     <li>List item 1</li>
     <li>List item 2</li>
   </ul>
 </body>
</html>

 

Необходимо добавить следующий код в шаблон, чтобы отобразить все значения LI элементов, доступные на странице:

<!--{foreach Flamingo.Selector.get('li') as item }-->
  Value is: <!--{= Flamingo.Selector.value('.', item) }--><br/>
<!--{/foreach}-->

Результат на странице будет выглядеть так:

Value is: List item 1
Value is: List item 2

Пример 2

Пример, приведенный ниже, показывает как отобразить все URL адреса из списка.

Исходный HTML код, доступный на оригинальной странице сайта:

<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>

 

Необходимо добавить следующий код в шаблон, чтобы отобразить все URL адреса из списка:

<!--{foreach Flamingo.Selector.get('li > a') as item }-->
    URL is: <!--{= Flamingo.jQ(item).attr('href') }--><br/>
<!--{/foreach}-->

Результат будет выглядеть так:

URL is: http://www.site1.com

URL is: http://www.site2.com

Пример 3

Следующий пример показывает как добавить CSS класс в список.

Исходный HTML код, доступный на оригинальной странице сайта:

<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> 

Необходимо добавить следующий код в шаблон, чтобы добавить новый CSS стиль в список:

<!--{
       var list = Flamingo.jQ('ul').clone(true);
       list.addClass('custom-class');
       Flamingo.output(list);
   }-->
<!--{= list[0].outerHTML}-->

HTML код результирующей страницы будет выглядеть так:

<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>

Пример 4

Пример, приведенный ниже, показывает как добавлять атрибут target=”_blank” в каждую ссылку из списка.

Исходный HTML код, доступный на оригинальной странице сайта:

<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>

Необходимо добавить следующий код в шаблон для того, чтобы добавить атрибут target=”_blank” в каждую ссылку из списка:

<--{
       var links = Flamingo.jQ('a').clone(true);
       links.attr('target', '_blank');
       Flamingo.output(links);
   }-->

HTML код результирующей страницы будет выглядеть так:

<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>

См. также

Flamingo API

Flamingo.Selector

Flamingo.jQ