◆ 単純にcssでdisplay:none;になってるだけ
◆ displayをblockなどに変えれば表示される

普段scriptタグやstyleタグの中身って表示されませんよね

アレ 実は表示させることができるんです
表示されていないのは単純にCSSのdisplayがnoneになっているだけ
displayをblockなど表示するように変更すれば表示されます
headタグ内にあるときは headタグのdisplayもblockなど表示するように変更しないといけません
displayプロパティは親のどこかでnoneになっているとその子孫すべてが強制的にnoneにされます

使い道ですが実際のコードを見せるのに使えます
プログラムなどを説明しているブログでは たいていコードが書いてあって結果が書いてあるか実行結果が直接表示されていると思います

しかし 書いてあるコードが直接実行されているわけではないので実行しているのとは違うことがあります
わざとではないはずなんですが(このブログであったとしても絶対わざとではありません。私のミスです。無いように気をつけます!) 書いてあるのが間違っていることがありえます
バグを見つけたけど結果を表示しているプログラムの方だけ直した とかコピペしたけどコピーしたのが前のバージョンだった などなど

ですが!
実際に実行しているプログラムやCSSを表示してしまえば間違っているわけ無いですよね

例えば少し前に書いたリファラを表示するコードです
この説明を書くとき 実行する方のプログラムは大丈夫でも 説明書きの方でreferrerがrefererになってるかもしれません
そのせいでコピペした人が ここの情報間違ってる と思ってしまうかもしれません
しかし 実際のコードを表示させることで確実に正しいことが示せます!


せっかくなのでもう一個サンプルです
scriptタグの実行中にbodyの最後に要素を付け足した時と window.onload時に bodyの最後に要素を付け足した時のサンプルです

ソースを見てみてください
説明用にただのテキストでコードを書いた部分はありません
表示されているコードは実際に実行されているコードです

実際のコードが表示されているので 結果が出ている以上 そのコードは正しいはずです 

なんか書いてて口調がどこかの怪しい商品紹介みたいになってる気がしました
とりあえずこんな方法でscriptタグやstyleタグも表示できるよ って記事です

使い道のサンプルは 理想といえば理想ですが 表示の都合上やりづらかったりもするのでたまにつかってみようかなー程度です