jQuery, beginner hello world page

Question

I am new in jQuery. To see my first hello world page, I have below code, but the result is a bare page without any alerting! it seems it can not read from jQuery-1.11.0 which I downloaded in the same directory of my html page.

<!DOCTYPE html>
<html lang="en">
  <head>
   <meta charset="utf-8" />
    <title>Hello World</title>
      <script type="text/javascript" src="jquery-1.11.0.min.js"> </script>
      <script type="text/javascript">
      $("document").ready(function() {
      alert ("Hello World");
      });
     </script>
   </head>
   <body>
  </body>
</html>

yes, my main goal is to make sure jQuery can be run in my web framework which is written by dJango. — Amir Nabaei, Mar 27 '14 at 01:47

Felix · Accepted Answer · 2014-03-27T02:01:22.657

4

Your HTML markup is invalid:

1) You need open <body> tag

2) You're missing " at the beginning of text/javascript

<script type="text/javascript">
// ------    ^ missing " here

Final code should look like this:

<!DOCTYPE html>
<html lang="en">

    <head>
        <meta charset="utf-8" />
        <title>Hello World</title>
        <script type="text/javascript" src="jquery-1.11.0.min.js">

        </script>
        <script type="text/javascript">
            $("document").ready(function() {
                alert("Hello World");
            });
        </script>
    </head>

    <body></body>

</html>

Working Demo

After inspecting your page, the jQuery library that you link to is blank.

http://cmpt470.csil.sfu.ca:8017/anabaei/exe/jquery-1.11.0.min.js

To avoid this problem, it's better to use a CDN link from jQuery or Google:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

edited Mar 27 '14 at 02:01

answered Mar 27 '14 at 01:41

Felix

37,892
8
43
55

Thanks, that was my problem and now it works; But my question is how come is possible because I downloaded and I can see that file in that directory! – Amir Nabaei Mar 27 '14 at 02:05
Maybe your file is blank or some problems with your OS :P – Felix Mar 27 '14 at 02:06
Actually you should put your ` – Felix Mar 27 '14 at 02:12
Thanks, it was very productive for me. – Amir Nabaei Mar 27 '14 at 02:49
I used to think jQuery script should be written in the header! – Amir Nabaei Mar 27 '14 at 03:01
Why do you change the accepted answer? Is there anything wrong? – Felix Mar 27 '14 at 05:13
No at all it was great, I though I can check as much answer I can :) – Amir Nabaei Mar 27 '14 at 05:27

Rey Libutan · Answer 2 · 2014-03-27T01:46:16.157

You don't have a starting <body> tag.

Your script sources are missing ".

Like this.

<!DOCTYPE html>
<html lang="en">
   <head>
      <meta charset="utf-8" />
      <title>Hello World</title>
      <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
      <script type="text/javascript">
         $("document").ready(function() {
                alert ("Hello World");
         });
      </script>
   </head>
   <body>
   </body>
</html>

Hendra Nucleo · Answer 3 · 2014-03-27T01:55:09.513

Try write like this

<!DOCTYPE html>
<html lang="en">
  <head>
   <meta charset="utf-8" />
    <title>Hello World</title>
      <script src="jquery-1.11.0.min.js"> </script>
      <script>
       $(function() {
       alert ("Hello World");
       });
     </script>
   </head>
  <body>
  </body>
</html>

For make more sure your jQuery working fine add this after the alert line in your jQuery

$('body').html("<p>Hello World</p>");

The text will appear too in your page so your jQuery source was ok.

Good luck.

score 0 · Answer 4 · answered Mar 27 '14 at 01:46

You are missing an opening quote and the opening body tag. Try this.

<!DOCTYPE html>
<html lang="en">
  <head>
   <meta charset="utf-8" />
    <title>Hello World</title>
      <script type="text/javascript" src="jquery-1.11.0.min.js"> </script>
      <script type="text/javascript">
      $("document").ready(function() {
      alert ("Hello World");
      });
     </script>
   </head>
  <body>
  </body>
</html>

jQuery, beginner hello world page

4 Answers4