Perl Web開発者のHTML・CSS入門

【HTML5】scriptタグ - JavaScriptを記述して実行する

scriptタグを使うと、JavaScriptを記述して実行できます。

<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script>
  
  $(function () {
    $('.js-hello').on('click', function () {
      alert('こんにちは');
    });
  });
</script>

<div>
  <button class="js-hello">スクリプトを実行</button>
</div>

JavaScriptとjQueryを使って、ボタンを押したときに「こんにちは」と表示しています。

外部のJavaScriptファイルを読み込む

scriptタグのsrc属性を使うと、外部のJavaScriptファイルを読み込むことができます。

<script src="/js/myapi.js"></script>
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>

ローカルファイルでも、インターネット上のファイルでも、どちらでも大丈夫です。