JavaScriptのdocument.titleとは?ページタイトルの取得・変更方法を初心者向けに解説
document.title は、HTML 文書の <title> タグに設定されている「ページタイトル」を取得・変更するためのプロパティです。
ブラウザのタブに表示されるタイトルを動的に変更したいときに利用できます。
document.titleとは?
document.title は、HTML 文書のタイトルを参照・設定するためのプロパティです。
document.title = “新しいタイトル”;
対象となるのは、HTML の次の部分です:
この値を JavaScript から読み取ったり、書き換えたりできます。
使用例
例1:ページタイトルを表示する
→ 現在のページタイトルがそのまま表示されます。
例2:タイトルを変数に代入する
→ ページタイトルが変数 docTitle に代入されます。
例3:ページタイトルを動的に変更する
→ ブラウザのタブに表示されるタイトルが変更されます。
document.title を使うメリット
- ページ内容に応じてタイトルを動的に変更できる
- ユーザーの操作に合わせてタイトルを変える演出が可能
- SPA(シングルページアプリ)などでよく利用される
注意点
- SEO の観点では、タイトルの動的変更は慎重に行う必要がある
- 検索エンジンは基本的に初期タイトルを評価する
- ユーザーが混乱しないよう、意味のある変更にとどめることが重要
まとめ
document.titleはページタイトルを取得・変更するプロパティ- ブラウザのタブに表示されるタイトルを動的に変更できる
- SEO への影響を考慮しつつ適切に利用することが大切