jQuery 読み込み方法
2011.03.12
この記事は最終更新日から1年以上が経過しています。
jQueryを読み込む為にはhead内にリンクを記述して読み込みます。
web上の読み込み方法
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja"> <head> <meta http-equiv="Content-Script-Type" content="text/javascript" /> ...(ここに記述) </head> <body> </body> </html>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.5.1.min.js"></script>
ダウンロードページ
また、
jQueryファイルをダウンロードし、任意のフォルダ等を作成、任意の場所に配置し任意のパス記述し読み込む事も可能です。
ローカル(任意のパスを指定)
<script type="text/javascript" src="js/jquery-1.5.1.min.js"></script>
読み込みパス記述後
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja"> <head> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <script type="text/javascript" src="http://code.jquery.com/jquery-1.5.1.min.js"></script> <title>jQuery test</title> <script type="text/javascript"> $(function(){ ...(ここに記述) }) </script> </head> <body> </body> </html>
head内に記述、または外部ファイルにスクリプトを記述することによって使用できます。
jQuery読み込み確認のスクリプト
$(function(){ if(jQuery){ $(".load").html("<p>jQueryは読込まれています。</p>"); } })
HTML
<div class="load"></div>
読み込まれていると
と表示されます。
HTML全体ソース
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> <script type="text/javascript" src="http://code.jquery.com/jquery-1.5.1.min.js"></script> <title>jQuery 読み込みtest</title> <script type="text/javascript"> $(function(){ if(jQuery){ $(".load").html("<p>jQueryは読込まれています。</p>"); } }) </script> </head> <body> <div class="load"></div> </body> </html>