神奈川県伊勢原市在住のkusuのサイトです!ホームページ制作のご依頼等承っております!

JavaScriptを使って文字表示させる方法

2015.07.01
JavaScript

 最近JavaScriptの勉強も始めたので、自分が復習するためのメモがてらJavaScriptについて今後記事を書いていけたらと思います!

 まず1回目の今回はJavaScriptを使って文字を表示させる方法について書いていきたいと思います。

文字表示させるための基本形

 まず、JavaScriptで文字表示させる基本形は以下の書き方になります。

<script>
   document.write("表示させたい文");
</script>

この
document.write(“~~~”);
“~~~”に表示させたい文などを記述してあげることで、その文を表示してくれるようになります!
 例えば

<script>
   document.write("見本の文章になります!!!");
</script>

このように書くと、以下のようにページ上では表示してくれます。

HTMLタグも使える!

 ちなみにこの
document.write(“~~~”);
内にはHTMLタグも使えます!

<script>
   document.write("<strong>HTML</strong>タグも使うことができます!");
</script>

試しに上のように書いてみると

このようにちゃんとHTMLタグが適用されて表示してくれます!

“~~~”という記述がダブる場合は片方を’~~~’と記述してあげればOK!

 最後に、慣れないうちに陥ってしまう問題点について解説しておきたいと思います。例えば、document.write(“~~~”);内に<a href=””>~~~</a>といった風にリンクタグを記述したい場合。この場合、間違って

<script>
   document.write("<a href="リンクURL">");
</script>

と書いてしまってはいけません。これだとうまく処理されず、何も表示されなくなってしまうのです。そういった時は、<a href=””>~~~</a><a href=”>~~~</a>という風に‘~~~’で括ってあげるとうまく処理して表示してくれるようになります!なので、上記コードの正しい書き方としては

<script>
   document.write("<a href='リンクURL'>");
</script>

このように記述してあげる必要があります。ただ、この書き方さえ覚えてしまえばあとは問題なくいけるので、覚えておきましょう!

まとめ

 以上がJavaScriptを使った文字表示の方法になります!
是非とも覚えておきましょう(*^-^)

スポンサーリンク
検 索