Как показывать только 3 строки по умолчанию, а всю таблицу только при нажатии кнопки “показать всю”

Есть рейтинг на сайте

№	Фамилия Имя	Очки
1	Мацюк Александр	280
2	Мурзин Максим	135
3	Тюков Владимир	85
4	Гаврилов Константин	80
5	Кутя Сергей	80
6	Кислань Елизавета	72
7	Моисеенко Александр	61
8	Краснов Денис	60
9	Кислань Сергей	59
10	Кулага Илья	59

Как сделать, что бы показывало на странице только ТОП3 и при нажатии на кнопку(ее пока нет) "показать весь рейтинг" открывало весь рейтинг.

Ответ

Например вот так:
var button = document.getElementById('showAll'); table = document.getElementById('myTable'); button.addEventListener('click', function() { // Проверяем на наличие класса и вызываем соответсвуюущую функцию table.classList.contains('opened') ? hideRows() : showRows(); }); function showRows() { table.classList.add('opened'); button.innerHTML = 'Скрыть'; } function hideRows() { table.classList.remove('opened'); button.innerHTML = 'Показать всё'; } .tablesorter tbody tr { display: none; } .tablesorter.opened tbody tr { display: table-row; } .tablesorter tbody tr:nth-child(1), .tablesorter tbody tr:nth-child(2), .tablesorter tbody tr:nth-child(3) { display: table-row; }

№	Фамилия Имя	Очки
1	Мацюк Александр	280
2	Мурзин Максим	135
3	Тюков Владимир	85
4	Гаврилов Константин	80
5	Кутя Сергей	80
6	Кислань Елизавета	72
7	Моисеенко Александр	61
8	Краснов Денис	60
9	Кислань Сергей	59
10	Кулага Илья	59