Comment modifier le titre de la page en javascript

Le "Titre de la page»Fait référence au bref résumé d'une page Web affichée en haut d'un onglet de navigateur. Le titre du document est spécifié à l'aide du étiqueter. L'onglet de la page ou la barre de titre du navigateur affiche le titre, qui doit être du texte uniquement. Lors de la navigation sur les pages du site Web, le titre de la page doit être modifié en fonction de son contenu.

Ce billet de blog définira la procédure de modification du titre de la page en javascript.

Comment modifier le titre de la page en javascript?

Pour modifier le titre de la page, utilisez les méthodes divisées:

• document.titre propriété
• QuerySelector () méthode

Voyons comment ces méthodes fonctionnent.

Méthode 1: Modifiez le titre de la page à l'aide du document.propriété de titre

Le titre du document peut être modifié ou récupéré à l'aide du «document. titre" attribut. Le titre de la page peut être modifié en fournissant le nouveau nom ou le titre en tant que chaîne à cet attribut.

Syntaxe
Suivez la syntaxe donnée pour l'utilisation de la propriété "document.titre«Pour modifier le titre de la page:

document.title = "NewTitle";

Exemple
Créez un bouton dans le fichier html qui modifiera le titre de la page dans l'événement Click:

Cliquez pour modifier le titre de la page

Ici, le titre de page de la page HTML créée est «Document«Cela sera modifié en cliquant sur le bouton:

Dans le fichier javascript, définissez une fonction, "ChangeTitle ()«Où définir le nouveau titre de la page qui sera modifié à l'aide du«document.titre" attribut:

fonction changeTitle ()
document.title = 'LinuxHint';

Sortir

La sortie ci-dessus montre que le titre de la page est modifié avec succès sur le bouton cliquer.

Méthode 2: Modifiez le titre de la page à l'aide de la méthode QueySelector ()

Il existe une autre façon de modifier le titre de la page, en utilisant le «QuerySelector ()«Méthode avec le«continent textuel" attribut. Cette méthode prend un élément DOM comme argument, puis modifie le titre actuel de la page à l'aide de la propriété TextContent.

Syntaxe
Utilisez la syntaxe suivante pour modifier le titre de la page à l'aide du «QuerySelector ()" méthode:

document.QuerySelector ('titre').textContent = "NewTitle";

Exemple
Définir une fonction "ChangeTitle ()»Et définissez le nouveau titre de la page en choisissant«titre"Élément dans"QuerySelector ()" méthode:

fonction changeTitle ()
document.QuerySelector ('titre').textContent = 'LinuxHint';

Sortir

Il peut être observé à partir de la sortie que le titre de la page a été modifié à l'aide de JavaScript.

Conclusion

Pour modifier le titre de la page, utilisez le «document.titre«Propriété ou«QuerySelector ()«Méthode avec le«continent textuel" propriété. Pour changer le titre de la page, le «document.titre»L'attribut est la méthode la plus largement utilisée. Il modifie rapidement le titre de la page, tandis que la deuxième méthode récupère d'abord l'élément de titre, puis modifie sa valeur, ce billet de blog montre les moyens de modifier le titre de la page dans JavaScript.