Question

我刚开始学习HTML，javascript和jQuery，但我无法将这三者联系在一起。到目前为止，我所做的是： HTML文件：

<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
    <script type="text/javascript" src="test.js"></script>
    <link rel="stylesheet" href="test.css" type="text/css"/>
</head>
<body>
    <button class="alert-btn">Click me for alert</button>
</body>

javascript文件：

$(".alert-btn").click(function(){
    alert("Hey there!");
});

正如您所看到的，我试图将链接放在html文件的头部，但它不起作用。我做错了什么，或者我需要添加什么？

Answer 1

如果代码：

$(".alert-btn").click(function(){
    alert("Hey there!");
});

在文件test.js中，您应该在加载DOM元素后加载此文件：

<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
    <link rel="stylesheet" href="test.css" type="text/css"/>
</head>
<body>
    <button class="alert-btn">Click me for alert</button>
    <script type="text/javascript" src="test.js"></script>
</body>

Answer 2

我肯定会在标题中使用`$（document）.ready（...）。

HTML，javascript和jQuery - 初学者

2 个答案: