Comment ajuster la taille de la police en JavaScript

En tant que langage de programmation puissant, JavaScript peut nous aider à implémenter diverses fonctions dans les pages Web. Parmi eux, l’ajustement de la taille de la police est également une exigence courante. Cet article explique comment ajuster la taille de la police en JavaScript.

1. Obtenir les éléments de la page Web

Avant d'ajuster la taille de la police, nous devons obtenir les éléments de la page Web qui doivent être exploités. Généralement, nous utiliserons getElementById(. ) de l'objet document Ou la méthode querySelector() pour obtenir l'élément correspondant. Par exemple, le code suivant obtient un élément div avec l'identifiant du contenu via la méthode querySelector() :

var content = document.querySelector("#content");

2. Ajustez la taille de la police

Après avoir obtenu l'élément, nous pouvons La taille de la police peut être ajustée via JavaScript. En JavaScript, on peut modifier le style CSS d'un élément grâce à l'attribut style. Le code suivant ajuste la taille de la police en définissant l'attribut fontSize de l'élément de contenu :

content.style.fontSize = "24px";

Il convient de noter ici que la valeur de fontSize doit être transmise sous forme de chaîne et l'unité doit être ajoutée , tel que "24px" .

3. Implémentation spécifique de l'ajustement de la taille de la police

En plus d'ajuster la taille de la police en définissant l'attribut fontSize de l'élément, nous pouvons également y parvenir par d'autres méthodes. Deux méthodes de mise en œuvre courantes seront présentées ci-dessous.

1. Utiliser des feuilles de style

Utiliser des feuilles de style pour ajuster la taille de la police est une méthode courante. Nous pouvons créer une nouvelle feuille de style dans la page Web, puis modifier la taille de police définie dans la feuille de style via JavaScript.

Créer une feuille de style par création dynamique, par exemple :

var style = document.createElement("style");
document.head.appendChild(style);

Ensuite, on peut modifier la taille de police définie dans la feuille de style en modifiant le textContent de l'élément style : #🎜 🎜#

style.textContent = `
  #content {
    font-size: 24px;
  }
`;

Utilisation du rapport de mise à l'échelle

document.documentElement.style.zoom = 1.5; // 将页面缩放比例修改为150%

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!