View Single Post
Jeg skriver et Grease-/Tampermonkey script, der jeg vil endre fonten på en nettside til en font fra Google Fonts.

Den "vanlige" måten å importere en Google font er jo å sette dette inn i HTML:

Kode

<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Tangerine">
Men scriptet kjøres jo bare som JS i etterkant, jeg kan jo ikke legge inn en HTML-tag på en side jeg ikke styrer..?

Har søkt mye om dette ("load/import font with JavaScript"), men alle piler peker meg bare mot Web Font Loader fra Google og Typekit, som etter sigende skal la meg importere fonts med JavaScript. Men også her må man jo sette inn HTML!?

Kode

<script src="https://ajax.googleapis.com/ajax/libs/webfont/1.6.26/webfont.js"></script>
<script>
  WebFont.load({
    google: {
      families: ['Droid Sans', 'Droid Serif']
    }
  });
</script>
Noen som vet hvordan jeg kan få til dette? Ser Tampermonkey har en @resource-greie, men har ikke fått det til å funke, og har ikke klart å finne et eneste eksempel som gjør noe lignende. Om ikke Tampermonkey har noen funksjoner for dette spesielt, går det an å gjøre i ren JavaScript? Dette scriptet kjøres jo etter at siden er ferdig lastet inn, så om jeg manuelt injiserer de nevnte HTML-taggene i dokumentet, så kjøres vel resten av scriptet mitt før fonten er ferdig lastet inn uansett..? Kan jeg omgå dette? Async await? Hjeeelp. Kan da vel ikke være sååå vanskelig!?

Tusen takk for at dere vil hjelpe en JS noob!

Jeg vil altså bare få lastet inn fonten sånn at jeg kan bruke den i scriptet med f.eks.

Kode

document.body.style.fontFamily = "denne fonten her";
Sist endret av JSnoob; 10. januar 2021 kl. 10:18. Grunn: Automatisk sammenslåing med etterfølgende innlegg.