Heim > Web-Frontend > js-Tutorial > Wie kann ich die Navigation auf YouTube-Seiten nahtlos erkennen und ändern?

Wie kann ich die Navigation auf YouTube-Seiten nahtlos erkennen und ändern?

Mary-Kate Olsen
Freigeben: 2024-12-04 05:24:11
Original
214 Leute haben es durchsucht

How Can I Detect and Modify YouTube Page Navigation Seamlessly?

Nahtlose Seitenänderungen in die YouTube-Navigation integrieren

Seitennavigation auf YouTube erkennen

Anders als herkömmliche Auf Websites, die Seiten beim Navigieren neu laden, verwendet YouTube eine Technik, die den Verlaufsstatus ersetzt und so Inhaltsskripts vermeidet Reinjektion.

Methoden zur Seitenübergangserkennung

Um Seitenübergänge auf YouTube zu erkennen, ziehen Sie diese Methoden in Betracht:

  • Hintergrundskript (MV3 Service Worker): Nutzen Sie die webNavigation API oder die Tabs API.
  • Inhaltsskript und navigationsuccess-Ereignis: Verfügbar im modernen Chrome.
  • Inhaltsskript und benutzerdefiniertes YouTube-Ereignis: Nutzen Sie das 'yt-navigate -start‘ oder ‚yt-navigate-finish‘ Veranstaltung.

Implementierung der Lösung

manifest.json:

{
  "matches": ["*://*.youtube.com/*"],
  "js": ["content.js"],
  "run_at": "document_start"
}
Nach dem Login kopieren

Inhalt. js:

document.addEventListener('yt-navigate-start', process);
if (document.body) process();
else document.addEventListener('DOMContentLoaded', process);
Nach dem Login kopieren

Prozessfunktion für Seitenänderung:

function process() {
  if (!location.pathname.startsWith('/playlist')) return;
  var seconds = [...document.getElementsByClassName('timestamp')]
    .reduce((sum, ts) => {
      const minsec = ts.textContent.split(':');
      return sum + minsec[0] * 60 + minsec[1] * 1;
    }, 0);

  if (!seconds) {
    console.warn('Empty playlist');
    return;
  }

  const timeHMS = new Date(seconds * 1000)
    .toUTCString()
    .split(' ')[4]
    .replace(/^[0:]+/, '');

  document
    .querySelector('.pl-header-details')
    .insertAdjacentHTML('beforeend', `<li>Length: ${timeHMS}</li>`);
}
Nach dem Login kopieren

Das obige ist der detaillierte Inhalt vonWie kann ich die Navigation auf YouTube-Seiten nahtlos erkennen und ändern?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage