ウキウキ社会人ブログ

かつては就活日記 あるときは卒論日記 そして今は……

はてなブログで夢小説を書いてみた

卒論進捗

無です

 

はてなブログJavaScriptが動くらしいからやって見るよ

というわけで、夢小説書けるじゃんと思ったので実際にやってみます。

javascriptが何って?webで動くプログラム的なもんです(適当)

あ〜有識者に殴られてしまう

とりあえず、一生素人マンがなんとなく適当にやってみた内容なので、ツッコミどころは勘弁してください。


さて一旦jsが動くかを確認します。と言っても、多分この記事を開いたときに名前を聞かれた人は問題ないはず。
一応この次の行に文章が表示されていればOKです。

どうスカね 


動作確認もしたところで、いざ実践

さて、実際にjavascriptを使って、名前変換小説を書いてみましょう。
とりあえず、名前入力ダイアログがこの記事を開いて最初に出てたと思います。

👆ここに入力した名前が表示されていれば、成功です。
入力しなかった場合は、nullさんになっているはず。

<script type="text/javascript">
 var name1 = window.prompt("あなたのお名前は?");
</script>

こんな感じで書いてみました。


ざっくり説明すると、この3行をブログ記事のどこかに書くことで、
name1という箱に閲覧者が好きに入力した名前を保存することができます。
そのため、記事内で好きなように名前を呼び出すことができます。

実際に呼び出す際に書いているのは、

<script type="text/javascript">
 document.write("こんな風にね。" +name1 + "さん💕");
</script>

これだけです。
document.writeを適当に説明すると、カッコの中にhtmlを書くと、それをドキュメントに追加してくれるメソッドです。
developer.mozilla.org

とりあえず、文字は""で囲むこと、そしてそれとname1という箱を+でくっつけて表示している…みたいな感じですかね?
カッコの中は、htmlのタグが使えるので

<script type="text/javascript">
 document.write("改行したり</br><b>太字</b>で出したり、<u>下線を引いたり</u>もできます。");
</script>

まあ自作サイトで頑張っていた頃の夢女子さんならなんとなく感覚を掴めるんじゃないですかね。
本当はもっとできることがあるはずなのですが、それはそのうち色々遊んでみようかなと思います。これ一生やらないフラグだわ
とりあえず、夢小説というものを実現するのにはこれだけで十分なので実際にオリジナル夢小説を書いてみました。

オリジナル夢小説「ブログから始まる恋」



はてな君……?どうして私の名前を?」
私に話しかけてきたのは、クラスでも人気のはてな君。そんな彼が、私に話しかけるなんて、一体どんな奇跡だろう。
「お前みたいなズボラな女の子でも、これなら簡単に綺麗なブログが書けちゃうぜ。はい、はてブロ!」
「これは……!!」
はてな君が私に渡してくれたのは、誰でも簡単にブログが始められるはてなブログだった。
わかりやすい編集画面と充実した機能で、無料ユーザーでも満足のいくサービスだ。

そういうとはてな君はニコッと笑った。私は自分の顔が熱くなるのを感じて、目をそらしてしまった。


は?
なんだこれ

寝ます
ありがとうございました
つーかはてなブログで夢小説書いたら検索に引っかかって死ぬだろ
やめとけ