Tworzenie stron internetowych

Często napotykanym problemem przez programistów jest dynamiczne wyszkukiwanie danych w tabeli. Problem ten można łatwo rozwiązać używając funkcji filter() dostępnej w bilbliotece JQuery.

Funkcja filter() w Jquery ograniczna zbiór dopasowanych lementów do tych które odpowiadają selektorowi lub spełniają test funkcji.
Kolorowanie co drugiego elementu listy
<ul>
<li>list item 1</li>
<li>list item 2</li>
<li>list item 3</li>
<li>list item 4</li>
<li>list item 5</li>
<li>list item 6</li>
</ul>
Za pomocą jquery piszemy kod:
$( "ul li" ).filter( ":even" ).css( "background-color", "red" );
Funkcja dopasuje parzyste elementy i wykona na nich funkcje css(), która zmieni kolor na czerwony. Oczywiście w tym prostym przykładzie wystarczy, że zastosujemy prosty css i efekt dostaniemy taki sam, ale chodzi o pokazanie działania funkcji filter().
Użycie funkcji testującej
Druga forma funkcji filter() pozwala nam na zastosowanie funkcji sprawdzającej. Dla każdego elementu, na którym zostanie wykonana funkcja filter, zostanie przeprowadzony test funkcji, którą piszemy sami.

Przykładowy kod:
<ul>
<li><strong>list</strong> item 1 – one strong tag</li>
<li><strong>list</strong> item <strong>2</strong> –
two <span>strong tags</span></li>
<li>list item 3</li>
<li>list item 4</li>
<li>list item 5</li>
<li>list item 6</li>
</ul>
Możemy filtrować elementy listy na podstawie ich zawartości.
$( "li" )
.filter(function( index ) {
return $( "strong", this ).length === 1;
})
.css( "background-color", "red" );
Ten kod na każdym elemencie listy(<li>) wykona metodę filter, która posiada funkcje sprawdzającą. Funkcja ta sprawdza czy w danym elemencie listy znajduje się więcej niż jeden tag <strong>. Jeżeli tak jest to wykonana jest funkcja CSS, która zmieni kolor tła elementu na czerwony. Przeczytaj więcej, aby dowiedzieć się o dynamicznym wyszukiwaniu elementów w tabeli.  […]