今日の人気記事

  1. GoogleにホストされているjQueryファイルの読み込み
  2. CDNにホストされているjQueryファイルの読み込み
  3. .click() 関数 - クリックイベント
  4. jQueryファイルの読み込み
  5. :submitセレクター

CDNにホストされているjQueryファイルの読み込み

スポンサーリンク

CDNにホストされているjQueryファイルの読み込み方法を解説します。

ダウンロードしたjQueryファイルを読み込む方法はこちらを参考にしてください。
» jQueryファイルの読み込み

CDNとは

CDN(Contents Delivery Network, CDN)とは、ファイルや画像といったWEBコンテンツをインターネット経由で配信するために最適化されたネットワークのことです。

サーバーが世界各地に分散しているので、最適なパフォーマンスを訪問者に提供することができ、一度ダウンロードしたWEBコンテンツはキャッシュされるので、再ダウンロードする必要がないといった利点もあります。

スポンサーリンク

jQueryファイルの読み込み

jQueryファイルをホストしているCDNは3つあります(記事投稿時)。

jQueryのCDNを使ったjQueryファイルの読み込み方法

<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>

GoogleのCDNを使ったjQueryファイルの読み込み方法

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

MicrosoftのCDNを使ったjQueryファイルの読み込み方法。

<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.11.1.min.js"></script>

jQueryファイルの動作確認

ページの読み込み時にアラートを表示するコードで、動作確認します。

<script type="text/javascript">
$(document).ready(function(){
  alert("jQueryファイルの読み込み完了でーす。");
});
</script>

GoogleのCDNからjQueryファイルを読み込んだデモで、動作を確認してみましょう。

デモ

デモのソース(HTML + jQuery)

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>jQueryファイルの読み込み - jQueryプラグインまとめのカルマ</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
alert("jQueryファイルの読み込み完了でーす。");
});
</script>
</head>
<body>
<h1>jQueryファイルの読み込みでーす。</h1>
</body>
</html>
スポンサーリンク