Question

我是jQuery的新手，我正在尝试使用它来更改CSS属性（颜色）。当jQuery脚本嵌入HTML时，CSS属性会成功更改。虽然通过外部文件加载jQuery时同样不起作用，如下所示。

这是我的测试用例不起作用。

<!doctype html>
<html>
<head>
<meta charset="utf-8"/>
<script type="text/javascript" src="scripts/jquery.min.js"></script>
<script type="text/javascript" src="scripts/colourChange.js"></script>

</head>
<body>

<h2 id="heading">HTML</h2>

<p><span class="keyword">HTML</span> is a markup language for describing web documents (web pages). <span class="keyword">HTML</span> stands for Hyper Text Markup Language.</p>

</body>
</html>

colourChange.js如下：

$("#heading").hover(function(){
$(".keyword").css("color", "blue");
});

我在调用jquery.min.js之前加载colourChange.js，但是，它不起作用。知道这里可能出现什么问题吗？

Answer 1

在执行代码之前，您需要确保元素已完全加载。将其包装在准备好的文件中：

$( document ).ready(function() {
   $("#heading").hover(function(){
      $(".keyword").css("color", "blue");
   });
});

此外，标题是一个id，因此需要在选择器中使用“＃”符号而不是“。”。（这用于上课）。

Answer 2

由于heading是css id，因此您的代码应该是这样的：

$("#heading").hover(function(){
$(".keyword").css("color", "blue");
});

Answer 3

您需要在$（document）.ready

中编写代码

$(document).ready(function() {
  $("#heading").hover(function(){
    $(".keyword").css("color", "blue");
  });
});

自＆＃34;标题＆＃34;是一个id，改变。到＃

外部jQuery脚本没有响应

3 个答案: