83229


jQueryを用いたカレンダーの作成をしているのですが $ is not defined
のエラーが表示されてしまいコンソールでのaddColumnHeaders,addCalenderDates,addGameInfo
の呼び出し及びブラウザへの行事の内容の表示が実行されません。jQueryの読み込みができていないのでしょうか。解決方法を含め、ご回答よろしくお願いします。

[code]

    <!DOCTYPE html>
    <html>
    <head>
       <meta charset="utf-8" />
       <meta name="viewport" content="width=device-width,initial-scale=1.0">
       <title>Tipton Turbines - Calendar</title>
       <link rel="stylesheet" media="screen and (max-device-width: 999px)" href="tthand.css" />
       <link rel="stylesheet" media="screen and (min-device-width: 1000px)" href="turbines.css" />
          <link rel="stylesheet" href="turbines.css" />
       <link href="http://fonts.googleapis.com/css?family=Maven+Pro:400,700,900" rel="stylesheet" type="text/css">
    
       <script src="modernizr.custom.05819.js"></script>
    </head>
    <script src="https://code.jquery-1.12.4.min.js"></script>
    <script src="modernizr.custom.05819.js"></script>
    <body>
       <div id="container">
          <header>
             <h1>
                <img src="images/ttlogo.png" alt="Tipton Turbines" width="182" height="93" title="" />
             </h1>
          </header>
          <nav>
             <ul>
                <li><a href="#">Tickets</a></li>
                <li><a href="#">Calendar</a></li>
                <li><a href="#">Players</a></li>
                <li><a href="#">News</a></li>
                <li><a href="#">Community</a></li>
             </ul>
          </nav>
          <article>
             <h2>Calendar</h2>
             <table>
                <caption>August 2016</caption>
                <thead>
                   <tr>
                      <th></th>
                      <th></th>
                      <th></th>
                      <th></th>
                      <th></th>
                      <th></th>
                      <th></th>
                   </tr>
                </thead>
                <tbody>
                   <tr>
                      <td class="differentMonth"></td>
                      <td id="08-1">
                         <p></p>
                         <p></p>
                      </td>
                      <td id="08-2">
                         <p></p>
                         <p></p>
                      </td>
                      <td id="08-3">
                         <p></p>
                         <p></p>
                      </td>
                      <td id="08-4">
                         <p></p>
                         <p></p>
                      </td>
                      <td id="08-5">
                         <p></p>
                         <p></p>
                      </td>
                      <td id="08-6">
                         <p></p>
                         <p></p>
                      </td>
                   </tr>
                   <tr>
                      <td id="08-7">
                         <p></p>
                         <p></p>
                      </td>
                      <td id="08-8">
                         <p></p>
                         <p></p>
                      </td>
                      <td id="08-9">
                         <p></p>
                         <p></p>
                      </td>
                      <td id="08-10">
                         <p></p>
                         <p></p>
                      </td>
                      <td id="08-11">
                         <p></p>
                         <p></p>
                      </td>
                      <td id="08-12">
                         <p></p>
                         <p></p>
                      </td>
                      <td id="08-13">
                         <p></p>
                         <p></p>
                      </td>
                   </tr>
                   <tr>
                      <td id="08-14">
                         <p></p>
                         <p></p>
                      </td>
                      <td id="08-15">
                         <p></p>
                         <p></p>
                      </td>
                      <td id="08-16">
                         <p></p>
                         <p></p>
                      </td>
                      <td id="08-17">
                         <p></p>
                         <p></p>
                      </td>
                      <td id="08-18">
                         <p></p>
                         <p></p>
                      </td>
                      <td id="08-19">
                         <p></p>
                         <p></p>
                      </td>
                      <td id="08-20">
                         <p></p>
                         <p></p>
                      </td>
                   </tr>
                   <tr>
                      <td id="08-21">
                         <p></p>
                         <p></p>
                      </td>
                      <td id="08-22">
                         <p></p>
                         <p></p>
                      </td>
                      <td id="08-23">
                         <p></p>
                         <p></p>
                      </td>
                      <td id="08-24">
                         <p></p>
                         <p></p>
                      </td>
                      <td id="08-25">
                         <p></p>
                         <p></p>
                      </td>
                      <td id="08-26">
                         <p></p>
                         <p></p>
                      </td>
                      <td id="08-27">
                         <p></p>
                         <p></p>
                      </td>
                   </tr>
                   <tr>
                      <td id="08-28">
                         <p></p>
                         <p></p>
                      </td>
                      <td id="08-29">
                         <p></p>
                         <p></p>
                      </td>
                      <td id="08-30">
                         <p></p>
                         <p></p>
                      </td>
                      <td id="08-31">
                         <p></p>
                         <p></p>
                      </td>
                      <td class="differentMonth"></td>
                      <td class="differentMonth"></td>
                      <td class="differentMonth"></td>
                   </tr>
                </tbody>
             </table>
          </article>
          <footer>
             <p>Tipton Turbines Baseball &bull; Tipton, Iowa</p>
          </footer>
       </div>
       <script src="ttjQuery.js"></script>
    </body>
    </html>
    
[/code]

[code]

    var daysOfWeek = [ "Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"
    ];
    
    var opponents = [ "Lightning","Combines","Combines","Combines","Lightning","Lightning","Lightning","Lightning","Barn Raisers","Barn Raisers","Barn Raisers","Sodbusters","Sodbusters","Sodbusters","Sodbusters","(off)","River Riders","River Riders","River Riders","Big Dippers","Big Dippers","Big Dippers","(off)","Sodbusters","Sodbusters","Sodbusters","Combines","Combines","Combines","(off)","(off)"
    ];
    
    var gameLocation = [ "away","away","away","away","home","home","home","home","home","home","home","away","away","away","away","","away","away","away","away","away","away","","home","home","home","home","home","home","",""
    ];
    
    function addColumnHeaders(){
    $("th").each( function( index ) { $(this).text( daysOfWeek[index] ); } );
      }
    
    function addCalenderDates(){
      var i = 1;
     
      do{
    
         $("#08-" + i + " p:first-child").text( i);
        i++;
      }while (i <= 31);
    }
    
    function addGameInfo(){
    
      for (var i= 0; i < opponents.length; i++) {
        var date =i+1;
        var p =$("#08-" + (i+1) + " p:nth-child(2) ");
    
        var str ="";
        if (gameLocation[i] === "away")
         str = "@";
        else if (gameLocation[i] === "home")
         str = "vs";
    
        p.text(str);
        p.append( opponents[i]);
      }
    }
    
    function setupPage(){
      addColumnHeaders();
      addCalenderDates();
      addGameInfo();
    }
    
    if(window.addEventListener){
      window.addEventListener("load",setupPage,false);
    }
     else if(window.attachEvent){
       window.attachEvent("onload",setupPage);
     }
    
[/code]


CC BY-SA 4.0
2021-10-23T02:12:44.747
83224
2021-10-23T14:55:03.270
2021-10-23T07:58:13.163
3060
48605
question
javascript html jquery
jQuery で $ is not defined とエラー表示される


jQuery のロードに失敗しています。現在以下の行でロードをしようとなさっていますが、これが上手く動いていません。

[code]

    <script src="https://code.jquery-1.12.4.min.js"></script>
    
[/code]

原因は 2 つあって、ひとつは URL が間違っていること、もうひとつはこの script タグが head タグの中でも body
タグの中でも無い場所に書かれていることです。

jQuery-1.12.4.min.js をお使いになられたいのであれば src は
`https://code.jquery.com/jquery-1.12.4.min.js` にすべきです。そうした上でこの script タグを
`<head> ... </head>` か `<body> ... </body>` の中に移動してください。

（また、可能であれば[最新の jQuery](https://jquery.com/download/) を使うようにした方が良いです。jQuery
1.12.4 には脆弱性が報告されており、かつ既に end of life となっており修正の見込みがありません。この回答が投稿された時点で jQuery
3.6.0 が最新です。）


CC BY-SA 4.0
2021-10-23T14:55:03.270
83229
2021-10-23T14:55:03.270
19110
83224
answer