
スキルアップ
2021.01.27
給料が高い仕事の特徴や年収を調査。高収入を目指す方法も紹介
「給料が高い仕事に就きたい」「今の給料に不満がある」など、給料についての願望や悩みは、多かれ少なかれ、持っている方も多いのではないかと思います。この記事では、給料が高い仕事の業界や特徴、年収を上げるための具体的な取り組み […]
JavaScript
2017.12.15
つい忘れがちな JavaScript のサンプルを挙げてみます。
今回は、JavaScript の 基本的な記述方法についてのサンプルを紹介します。
1.script タグの書き方
2.noscript タグ
3.コメントの書き方
4.実行方法
HTML ファイルに JavaScript を記述する場合には、script 要素内( <script> ~ </script> )に記述します。
script タグは、HTML ファイル内の body 要素内( <body> ~ </body> )に記述します。
<body> <script type="text/javascript"> <!-- // ここに JavaScript のソースコードを記述する //--> </script> </body>
script タグの内側の「 <!– 」と「 //–> 」は、script タグに非対応のブラウザ対策です。
「 <!– 」と「 //–> 」を記述していると、ユーザーが script タグに非対応のブラウザを使用した場合に、スクリプト要素内のソースコードが テキストとして表示されるのを防ぎます。
ブラウザが JavaScript に対応していない場合は、script タグは読み込まれず、script タグ内の javaScript コードは通常「 <!– ~ //–> 」内に記述するため、何も表示されません。
このような事態を想定して、ブラウザが JavaScript に対応していない場合に 何らかのメッセージを表示させたい時は、noscript タグを使用します。
<body> <script type="text/javascript"> <!-- // JavaScript のソースコード //--> </script> <noscript> // JavaScript に対応していない場合に表示させたい内容を記述する </noscript> </body>
noscript タグ内の内容は、ブラウザが JavaScript に対応している場合は表示されず、JavaScript に非対応のブラウザの場合のみ表示されます。
ソースコードの説明や注意書きなど、Webページには表示させず、ファイル上にのみ残しておきたい情報があります。
このような内容は、コメントアウトを使って記述します。
<script type="text/javascript"> <!-- //この行がコメントアウトされる alert("Hello!"); //この行のこのエリアがコメントアウトされる /* スラッシュとアスタリスクで囲まれた部分 全てがコメントアウトされる */ //--> </script>
「 // 」を記述すると、それ以降の 1 行がコメントアウトされます。
それより前の部分はスクリプトとして実行されるので、スクリプトの後ろにコメントを残すことができます。
複数行をコメントアウトする場合は、コメントを「 /* ~ */ 」で囲みます。
script タグ内に JavaScript の命令を記述することで、ページの読み込みと同時に実行されます。
<script type="text/javascript"> <!-- document.getElementById("msg").innerHTML = "Welcome!"; //--> </script>
ボタンをクリックした時に実行したい場合は、次のように記述します。
<script type="text/javascript"> <!-- function disp() { alert("Hello!"); } //--> </script> <form> <input type="button" value="実行" onClick="disp()"> </form>
実際にボタンをクリックしてみて下さい。
ボタンをクリックするというイベント( 動作 )をきっかけにスクリプトを呼び出すため、「 onClick 」というイベント処理を使用しています。
onClick イベントによって、ボタンがクリックされたら実行する という ユーザーの動きに合わせた処理が可能になります。
ユーザー定義関数を使用せず、次のように スクリプトを直接記述することもできます。
<form> <input type="button" value="実行" onClick="alert('Hello!')"> </form>
直接記述する場合は、引用符の使い方に注意をします( 外側をダブルコーテーションで囲んだら、内側はシングルコーテーションを使用。逆も可 )。
リンクをクリックした時に実行したい場合は、次のように記述します。
<script type="text/javascript"> <!-- function disp() { alert("Hi!"); } //--> </script> <a href="javascript:disp()">実行</a>
実際にリンクをクリックしてみて下さい。
実行
ユーザー定義関数を使用せず、次のように スクリプトを直接記述することもできます。
<a href="javascript:alert('Hi!')">実行</a>
直接記述する場合は、引用符の使い方に注意をします( 外側をダブルコーテーションで囲んだら、内側はシングルコーテーションを使用。逆も可 )。
スキルアップ
2021.01.27
「給料が高い仕事に就きたい」「今の給料に不満がある」など、給料についての願望や悩みは、多かれ少なかれ、持っている方も多いのではないかと思います。この記事では、給料が高い仕事の業界や特徴、年収を上げるための具体的な取り組み […]
スキルアップ
2021.01.25
独学でプログラミングの勉強を始める社会人たちが続々と増えていますが、最もオススメな学習法は「まずは無料の学習サイトでプログラミングに触れてみること」。そこで本記事では、初心者におすすめのプログラミング学習サイトを国内外あ […]
スキルアップ
2021.01.25
この記事ではシステムエンジニア(SE)とプログラマ(PG)の違いをわかりやすく解説します。システム開発の流れを説明しながら具体的に携わる仕事内容や必要スキル、年収まで違いを比較していきますので、ぜひ参考にしてください。 […]
スキルアップ
2021.01.22
通勤せず、家で仕事ができたら理想的だと思いせんか?コロナ禍の今、在宅ワークに注目が集まっています。パソコンとインターネット回線があればどこでもできる仕事が増え、完全在宅を前提とした求人も多く目にするようになりました。ここ […]
スキルアップ
2021.01.22
大学生のうちにプログラミングスキルを身につけておくべきか悩んでいる方、エンジニアとして働くことに興味がある方はぜひご覧ください! 大学生でプログラミングを習得するメリット、おすすめのプログラミング言語&学習法、失敗しない […]
スキルアップ
2021.01.22
本記事では、給料やお金をもらいながらでもプログラミングを学べる方法や、未経験からでもエンジニアへの転職が可能な理由について紹介します。プログラミングスキルが未経験者の就職や転職において有利となる理由も解説。これからプログ […]
INTERNOUS,inc. All rights reserved.