非常简单的jQuery函数不起作用

Question

我在一个.html文件中有以下代码，然后使用浏览器打开它。为什么我在页面加载时没有收到"Hello World“提示？我看到的只是“测试”的文字。

<!DOCTYPE html>
<html>
    <head>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
            $(document).ready(function() {
            alert("Hello World!");
        });
        </script>
    </head>
    <body>
    <p>
        Test
    </p>
    </body>
</html>

Answer 1

不能在声明[src]属性的同时执行<script>元素的内容。

您需要使用第二个<script>元素：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
    $(document).ready(function() {
        alert("Hello World!");
    });
</script>

注意：在jQuery中使用document.ready回调时，建议使用速记版本将jQuery别名为$，以获得更好的脚本兼容性：

jQuery(function ($) {
    alert('Hello World');
});

Answer 2

像这样改变它

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
      <script>
        $(document).ready(function() {
        alert("Hello World!");
    });
    </script>

Answer 3

<!DOCTYPE html>
<html>
     <head>
         <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
         <script type="text/javascript">           
                $(document).ready(function() {
                    alert("Hello World!");
               });
         </script>
     </head>
     <body>
         <p>Test</p>
     </body>
</html>

使用第一个脚本标记，我们加载jquery。在第二个脚本中