window.status(グローバルでは単に status)は、かつてブラウザ画面下部のステータスバーに任意の文字列を表示できたプロパティです。しかし今このコードを書いても、画面には何も表示されません。プロパティ自体は今も存在するのに、なぜ機能しなくなったのでしょうか。
この記事では、window.status が無効化された理由と、「ユーザーに状況を伝えたい」という本来の目的を今どう実現するかを、動くコードとあわせて解説します。
window.status は現在のブラウザでは設定しても表示に反映されません(プロパティ自体は残り、値の読み書きはできます)。フィッシング(URL偽装)対策として無効化されたためです。ユーザーへの状態通知は、aria-live を付けたDOM表示やトースト通知で実装します。window.statusプロパティとは
window.status は、ブラウザウィンドウのステータスバー(画面下部の細い帯)に表示する文字列を制御するためのプロパティでした。リンクにマウスを乗せたときや処理の進行中にメッセージを出す、といった用途で1990年代から使われてきました。
よくある誤解ですが、これはIE専用の機能ではありません。もともと Netscape Navigator の時代から存在し、当時のすべての主要ブラウザが対応していた古い共通機能です。似た名前の window.defaultStatus(既定で表示する文字列)も同じ仲間で、こちらも現在は廃止されています。
window.status = "新しいステータスメッセージ";
今のブラウザで実行すると何が起きるか
結論から言うと、設定しても画面のステータスバーには反映されません。ただしプロパティとしては生きているため、代入した値を読み返すことはできます。
window.status = "処理中です..."; // 値の読み書き自体は成立する console.log(window.status); // → "処理中です..." // しかしステータスバーには何も表示されない(ブラウザが無視する)
つまり window.status は「エラーにはならないが、見た目には何も起きない」状態です。HTMLの仕様上もプロパティは残されていますが、表示への影響は仕様として保証されていません。
なぜ無効化されたのか(フィッシング対策)
無効化の理由はセキュリティ、とくにフィッシング(URL偽装)対策です。かつては、リンクにマウスを乗せたときにステータスバーへ「本物の安全なURL」を偽って表示し、実際のリンク先は別の悪意あるサイト、という手口が横行しました。ユーザーはステータスバーの表示を信じてクリックしてしまうわけです。
<!-- 表示は安全なURL、実際の遷移先は別サイト、という偽装 --> <a href="https://evil.example.com/" onmouseover="window.status='https://www.your-bank.example/'; return true" onmouseout="window.status=''; return true"> 安全な銀行のサイト </a>
window.status の値は表示されません。リンク先のURLはブラウザが自分で正しく表示します。現在のブラウザには常時表示のステータスバー自体がほとんどなく、リンクにマウスを乗せたときだけブラウザが本当の遷移先URLを左下に重ねて表示します。この表示はJavaScriptから変更できません。これがまさに偽装を防ぐための仕組みです。
ユーザーに状況を伝える代替手段
「処理中」「保存しました」といった状態をユーザーに伝えたいなら、ステータスバーではなくページ内に表示するのが現代の作法です。スクリーンリーダーにも届くよう aria-live を付けるのがポイントです。
方法1:DOM要素に表示する(aria-liveで読み上げ対応)
もっとも基本的で確実な方法です。表示用の要素を1つ用意し、textContent でメッセージを書き換えます。role="status" を付けると、内容の変化をスクリーンリーダーが自動で読み上げます。
<div id="status" role="status" aria-live="polite"></div>
const statusEl = document.getElementById("status");
// 状態を伝える
statusEl.textContent = "保存しました";
// 数秒後に消す場合
setTimeout(() => { statusEl.textContent = ""; }, 3000);
要素のテキストを書き換える詳しい方法はtextContent・innerHTMLの使い分けで解説しています。
方法2:トースト通知(一時的なポップアップ)
画面の隅にふわっと出て自動で消える「トースト」もよく使われます。要素を動的に作って追加し、一定時間後に削除するだけで実装できます。
function showToast(message) {
const toast = document.createElement("div");
toast.className = "toast";
toast.setAttribute("role", "status"); // 読み上げ対応
toast.textContent = message;
document.body.appendChild(toast);
// 3秒後に自動で消す
setTimeout(() => toast.remove(), 3000);
}
showToast("リンクをコピーしました");
見た目(位置やフェード)は .toast のCSSで整えます。フォーム送信中のスピナーやローディング表示まで含めた実装はフォーム送信のローディング実装が参考になります。
方法3:リンク先の表示はブラウザに任せる
「リンクがどこに飛ぶか」を伝えたいだけなら、JavaScriptは不要です。前述のとおり、リンクにマウスを乗せればブラウザが正しい遷移先URLを自動表示します。サーバーとの通信中の状態を扱いたい場合は、fetch APIで非同期通信と組み合わせ、開始時と完了時に方法1・2でメッセージを出すとよいでしょう。
既存コードのstatusプロパティはどうするか
表示に影響しないため、古いコードにある window.status = "..." は基本的に削除して問題ありません。エラーの原因にもなりません。
window.status をグローバル変数の保存場所として誤用している(あとで値を読み返している)ことがあります。その場合は消すとロジックが壊れるので、削除前に値を読んでいる箇所がないか検索してください。通常の状態表示目的であれば、そのまま消して代替手段に置き換えて構いません。よくある質問(FAQ)
window.status は旧ステータスバー表示用の文字列で、Response.status(fetchやXMLHttpRequestの戻り値)は 200 や 404 などのHTTPステータスコードを表す数値です。名前が同じだけで関係はありません。XMLHttpRequest は fetch API に、ActiveXObject は fetch や Web Storage などの標準APIに置き換えます。古いブラウザ向けのpolyfillを足すより、モダン標準への移行を優先するのがおすすめです。まとめ
window.status はかつてステータスバーへの表示に使われた古いプロパティですが、フィッシング対策として現代のブラウザでは無効化され、設定しても画面には表示されません。
ユーザーに状況を伝えたいときは、ステータスバーに頼らずページ内のDOM表示(aria-live)やトースト通知で実装しましょう。リンク先の表示はブラウザが安全に行ってくれるため、こちらが手を出す必要はありません。既存コードの window.status は、グローバル変数として読み返している箇所がないか確認したうえで、見つかれば代替手段に置き換えていくとよいでしょう。
