使远程.js正常工作

Question

我写了一小段脚本。 当我直接将其添加到页面时，它就可以正常工作。 但是，当脚本位于.js文件中时，如何使它工作？ 将代码放入.js文件是否足够？ 还是我需要添加额外的代码行？

我知道我必须在标题中引用该文件。 但这并不能解决问题。 这是脚本：

    $("#david").mouseover(function() {
    $('#charlotte').addClass('hover');
    $('#timon').addClass('hover');
}).mouseout(function() {
    $('#charlotte').removeClass('hover');
    $('#timon').removeClass('hover');    

});

$("#charlotte").mouseover(function() {
    $('#david').addClass('hovert');
    $('#timon').addClass('hovert');
}).mouseout(function() {
    $('#david').removeClass('hovert');
    $('#timon').removeClass('hovert');    

});

$("#timon").mouseover(function() {
    $('#david').addClass('hovertt');
    $('#charlotte').addClass('hovertt');
}).mouseout(function() {
    $('#david').removeClass('hovertt');
    $('#charlotte').removeClass('hovertt');    

});

我希望你们能帮助我！

我知道这是一个非常基本的问题，但是我找不到所需的答案，而且我仍然不擅长编写脚本。

Answer 1

首先，您需要在HTML页面中包含该javascript文件：

<script src="yourscript.js"></script>

要么

<script src="pathToYourScript/yourscript.js" type="text/javascript"></script>

此外，您将需要告诉js何时执行，我建议将代码包装在

$(document).ready(function{
 // your code here 
})

或在window.load中

$(window).load(function{
 // your code here 
})

或具有自我执行功能：

(function(){
 // your code here 
})();

Answer 2

在HTML文档中，在jQuery脚本之后添加第二行。

<script src="/js/jquery.js"></script>
<script src="/js/name-of-your-file.js"></script>

在示例中，我在您的脚本之前添加了/js/ 。 最佳做法是将文件分成特定的文件夹，因此您必须创建一个新的js文件夹。 另外，jQuery需要就位，并准备好您开始使用它。 如果您需要等待文档加载，则需要在下面包装代码。

$(function() {
  // Past your code here.
  // This syntax is simply a shortcut for 
  // $(document).ready(function(){});
});