困ったこと

CSSやJavascriptを編集した後サーバーなどにあげたりし、再読み込みしても更新されないときがある。

原因

①Webページが参照する画像ファイルやCSSファイルなどのキャッシュ、あるいは②Webページで実行されたJavaScriptが動的に読み込んだファイルなどの2次的なキャッシュが残っているためである。

キャッシュというのは、2回目以降に開かれるWEBページをよりスムーズに開くため、あるいはサーバー負荷の軽減等のため、一定期間内に同ページを開くときは、前回開いていた履歴を表示する。

1回目に開いたときと2回目で開いたときの間に、HTMLファイルが変更されない、かつCSSファイル等の外部ファイルが更新されると、高速化するために便利なキャッシュが、逆に正確性を欠くものとなる。

解決策

基本的にキャッシュを削除すればよい。ブラウザにフォーカスされているときに次の操作を試みる。（以下Windows）

解決策1　Ctrl + Shift + R　または　Shift + F5

Webページから直接参照している画像ファイルやCSSファイルなどのキャッシュを破棄してリロードすることができる。

これにより①のキャッシュを消去することができる。
しかし②のキャッシュは消去できない。

解決策2　シークレットウィンドウ（Ctrl + Shift + N）で開く

シークレットウィンドウで新しくページを開くとキャッシュは①も②（Webページで実行されたJavaScriptが動的に読み込んだファイルなど）も削除される。＜誤り＞

シークレットウィンドウで新しくページを開くと、①も②（Webページで実行されたJavaScriptが動的に読み込んだファイルなど）もない真っ新なページが表示される。ただし通常のページで開かれた際に記録されるキャッシュは別で残っているので注意。
（コメントにて指摘があった部分を修正しました。ありがとうございました。）

ただし、変更後はシークレットウィンドウを再読み込みするのではなく、シークレットウィンドウを閉じて再度開く必要がある。ウィンドウを閉じない限り（たとえタブを閉じてもダメ。右上の赤バツを押すということ）キャッシュは削除されない。

解決策3　開発者ツールを開いた状態（Ctrl + Shift + I または F12）のままリロードを右クリックする

↻
通常の更新（Ctrl + R）
ハードリフレッシュ（Ctrl + Shift + R）
キャッシュをクリアしてハードリフレッシュ

このように表示される。

「ハードリフレッシュ（Ctrl + Shift + R）」が解決策1であり、①のキャッシュのみ削除できる。

「キャッシュをクリアしてハードリフレッシュ」を使うと①に加え②（Webページで実行されたJavaScriptが動的に読み込んだファイルなど）のキャッシュも削除できる。

解決策4　開発者ツールを開いた状態のまま（Ctrl + Shift + I または F12）にしてキャッシュを元から記録しない

開発者ツールを開き（Ctrl + Shift + I または F12）、「ネットワーク」タブで「キャッシュを無効化」にチェックを入れると、開発者ツールを開いている間はすべて無効化される。（代表的なブラウザではおおむね利用可能）

以下の赤い四角のうち、どちらかの「キャッシュを無効化」を押す。（Edge）

（コメントにて有益な情報をいただきました。ありがとうございました。）