jQueryを使う時に必要な下準備を整理する。
Contents
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サイトの作り方についてまとめていく。 Contents1 Webサイトの仕組み2 ウェブデザインが思いつかない時3 HTMLでのwebサイトの作成方法4 ...
続きを見る
また、コンピューターについての全体像も把握しておくと、web制作の理解にも役立つ。
-
-
コンピューターサイエンスとITの全体像
ITの進化は早く、新しい言葉がどんどん出てきて、情報に追いつくのが難しく感じてしまう。 もしコンピュータサイエンスやITの内容の基礎だったり全体像を把握しておけば、今後新しいITがどんどん出てきても早く吸収していけるので ...
続きを見る