Automatyczne rozwijanie "pokaż więcej" i ładowanie treści paginowanej
Wątki komentarzy, recenzje produktów, dokumentacja i wyniki wyszukiwania uwielbiają ukrywać treść za przyciskiem "Pokaż więcej" lub dzielić ją na niekończące się strony. Dzięki regule JavaScript JustZix możesz rozwinąć i załadować to wszystko automatycznie, a potem czytać w jednym ciągłym przewijaniu.
Wzorzec: klikaj, aż zniknie
Reguła automatycznego rozwijania robi jedną rzecz wielokrotnie: znajdź przycisk, kliknij go, poczekaj na nową treść, powtórz — aż przycisk zniknie. Oto samodzielna wersja z limitem bezpieczeństwa, więc nigdy nie może zapętlić się w nieskończoność.
function autoExpand(selector, maxClicks) {
var clicks = 0;
var timer = setInterval(function () {
var btn = document.querySelector(selector);
if (!btn || clicks >= maxClicks) {
clearInterval(timer);
return;
}
btn.click();
clicks++;
}, 800);
}
autoExpand('.show-more-button', 50);
Interwał 800 ms daje stronie czas na wyrenderowanie nowych elementów między kliknięciami. Zwiększ go dla wolnych stron. Limit maxClicks równy 50 zapobiega niekontrolowanym pętlom na nieskończonych feedach.
Dopasuj przycisk po tekście
Jeśli przycisk nie ma stabilnego selektora, znajdź go po jego etykiecie. Ten pomocnik zwraca pierwszy widoczny element, którego tekst pasuje.
function findByText(words) {
var els = document.querySelectorAll('button, a, [role="button"]');
for (var i = 0; i < els.length; i++) {
var t = (els[i].textContent || '').trim().toLowerCase();
for (var j = 0; j < words.length; j++) {
if (t.indexOf(words[j]) !== -1 && els[i].offsetParent !== null) {
return els[i];
}
}
}
return null;
}
var timer = setInterval(function () {
var btn = findByText(['show more', 'load more', 'view more', 'see more']);
if (btn) { btn.click(); } else { clearInterval(timer); }
}, 800);
Sprawdzenie offsetParent !== null pomija ukryte przyciski, więc pętla kończy się prawidłowo, gdy prawdziwy przycisk zostaje usunięty.
Rozwiń każdą zwiniętą sekcję naraz
Strony dokumentacji często używają wielu małych przełączników (akordeony FAQ, przykłady kodu). Aby otworzyć je wszystkie za jednym razem, kliknij każdy przełącznik, który jest aktualnie zwinięty.
var toggles = document.querySelectorAll('[aria-expanded="false"]');
toggles.forEach(function (t) {
t.click();
});
Atrybut aria-expanded jest standardem sieciowym, więc działa to na szerokim zakresie dostępnych komponentów bez selektorów specyficznych dla strony.
Automatycznie ładuj następną stronę
Dla klasycznej numerowanej paginacji możesz wciągnąć elementy następnej strony do bieżącej. Ta wersja znajduje link "następna", pobiera stronę przez fetch w tym samym pochodzeniu i dołącza nowe elementy listy.
function loadNextPage(listSelector, nextSelector) {
var next = document.querySelector(nextSelector);
var list = document.querySelector(listSelector);
if (!next || !list || !next.href) return;
fetch(next.href)
.then(function (r) { return r.text(); })
.then(function (html) {
var doc = new DOMParser().parseFromString(html, 'text/html');
var newList = doc.querySelector(listSelector);
if (newList) {
Array.prototype.forEach.call(newList.children, function (item) {
list.appendChild(item);
});
}
})
.catch(function () { /* ignoruj bledy sieci */ });
}
loadNextPage('.results-list', 'a[rel="next"]');
To żąda stron tylko z tej samej strony, na której już jesteś — żadnych wywołań stron trzecich. Owiń to w pętlę z limitem kliknięć, jeśli chcesz kilku stron naraz.
Praktyczna rada
- Zawsze ustaw limit kliknięć. Nieskończone przewijanie plus pętla bez limitu będzie pobierać w nieskończoność.
- Używaj selektorów
aria-expanded, gdy są dostępne; przeżywają przeprojektowania stron lepiej niż nazwy klas. - Przetestuj synchronizację interwału — zbyt szybko, a klikniesz, zanim nowa treść się ustabilizuje.
- Dla stron z prawdziwym nieskończonym przewijaniem rozwinięcie wszystkiego może obciążyć kartę; rozwijaj partiami.
Znajdź gotowe wersje w gotowych przykładach lub pobierz JustZix, aby zacząć automatyzować. Jeśli na stronie wyłączone jest też zaznaczanie, zobacz odblokuj kopiowanie i prawy przycisk.
Oceń ten wpis
Brak ocen — oceń jako pierwszy.