jQueryを使う時に必要な下準備を整理する。
jQueryのスクリプトをHTMLファイルに読み込む。
下記のスクリプトをHTMLへ埋め込む。
バージョンについては最新版を常に確認しておく。
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
HTMLへの埋め込みはhead内に埋め込むこと。
<!DOCTYPE html>
<html>
<head>
<title>ページのタイトル</title>
<meta charset="UTF-8">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
</head>
<body>
<h1>Hello World!</h1>
</body>
</html>
jQueryを書き込むファイルもHTMLファイルに読み込む
jQueryを書き込むファイルも、HTMLファイルに読み込む。
今回jQueryを各ファイル名を「script.js」とする。
script.jsは<body></body>内に記述する。
<!DOCTYPE html>
<html>
<head>
<title>ページのタイトル</title>
<meta charset="UTF-8">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
</head>
<body>
<h1>Hello World!</h1>
<script src="script.js"></script>
</body>
</html>
この2ステップで、script.jsで記述したjQueryが読み込まれるようになる。
全体像を把握する
下記にHTMLとCSS、Javascriptを使ったwebサイトの作り方についての記事をまとめた。
また、コンピューターについての全体像も把握しておくと、web制作の理解にも役立つ。
コメントを残す