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サイトの作り方についての記事をまとめた。
-
-
HTMLとCSS、Javascriptを使ったwebサイトの作り方まとめ
このページでは、HTMLとCSS、Javascriptを使ったwebサイトの作り方についてまとめていく。 Webサイトの仕組み まずはwebサイトの仕組みなどをわかっておくと、今後の準備がかなり楽にな ...
続きを見る
また、コンピューターについての全体像も把握しておくと、web制作の理解にも役立つ。
-
-
Screen-Shot-2021-06-11-at-11.45.16
続きを見る