~ モバイル版(スマートフォン)の操作 ~
左右にスワイプすると、前後の投稿へ移動します。
← 前の投稿 | 次の投稿 →
日々のコンピュータ情報の集積と整理

Dr.ウーパのコンピュータ備忘録

2014年4月27日日曜日

Chrome:noscript タグの不思議な動作。初期読み込みと2回目以降の読み込みで動きが変わる


スポンサーリンク

Google Chrome で JavaScript を実行できない環境をテストしていた時の話です。
<noscript>タグで囲った中身の動作が、初回の読み込み時2回目以降の読み込み時表示の動作が変わることを確認しました。



動作確認環境:Google Chrome バージョン 34.0.1847.116 m


確認に使用した HTML

<html>

<head>

<title>test page</title>

</head>

<body>

<h1>TEST.</h1>



<script type="text/javascript">

<!--

//-->

</script>

<noscript>



<b>本来表示したい内容</b><br />

&lt;b&gt;本来表示したい内容&lt;/b&gt<br />

<img src="test.png" alt="test image" width="100" height="100" /><br />



</noscript>



</body>

</html>



確認手順

(1) JavaScript 有効時にページを表示する

 上記の HTML を JavaScript 有効時に読み込んだ場合の Chrome の表示は次のようになります。

ページ読み込み:JavaScript 有効時

当然、<noscript>タグの中身は表示されません。


(2) JavaScript を無効にしてページを表示する(初回表示)

次に JavaScript の実行を無効にして、リロードによりページを表示します。

設定:すべてのサイトに対して JavaScript の実行を許可しない ラジオボタンにチェックを入れ、完了をクリック
ページ読み込み:JavaScript 無効時(初回表示)

<noscript>タグ内の文字列がHTMLとして解釈されず、そのまま出力されています。


(3) JavaScript 無効状態で再度ページを読み込む(2回目以降の読み込み)

(2) の状態で、そのままページのリロードを実行して、ページを読み込みます。

ページ読み込み:JavaScript 無効時(2回目以降の読み込み

今度は<noscript>内の文字列が HTML として解釈され、タグの解釈、エスケープされた文字のアンエスケープが行われています。

その後は何度ページをリロードしても、この状態の表示が行われました。


どうしてこのような動作をするのか調査をしていないため不明です。
思いつくところ、Chrome 内のキャッシュなどが影響をしているんでしょうか・・・?


まとめ


  1. JavaScript を無効にしてページを表示したとき、初回表示の場合、<noscript>タグ内の文字列がHTMLとして解釈されず、そのまま出力されていた。
  2. JavaScript を無効にしてページを表示したとき、2回目以降の表示の場合、<noscript>内の文字列が HTML として解釈され、タグの解釈、エスケープされた文字のアンエスケープが行われていた。


このような動作になる理由は不明ですが、2回目以降は正常に動作することから、万が一初回表示のように HTML が解釈されずそのまま表示されてしまった時のために、コメントなどで、

<!-- この文字列が表示されている場合、ブラウザが HTML の処理に失敗しています。お手数ですがページの再読み込みを実行してください。 -->

と記載しておき、ユーザ自身にページのリロード処理を行ってもらうよう依頼するのが、今考えられるうちの最善の策でしょうか。
(JavaScript 無効時の初回は<noscript>内が HTML として解釈されないため、<!-- -->のコメントもそのまま画面に表示されるため。)


スポンサーリンク

コメントを投稿

コメント投稿機能について