Question

注意：我是Javascript和jQuery的新手

我有这个测试代码：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Test Page</title>
<link href="_css/main.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="mainArticle">
<h1>This is some test code</h1>
  <p>Lots of text to test this test co</p>
</div>

<script scr="jquery-1.11.3.min.js"></script>
<script src="script.js"></script>


</body>
</html>

这是在我的CSS文件中：

.highlight {
background: #ffffcc;
}

然后在我的JS文件中，我有：

jQuery("#mainArticle").addClass("highlight");

我无法让这个工作。我的div的背景是没有应用'突出'。我的JS文件中的错误一直说'jQuery在定义之前就被使用了'。我不知道该怎么做。

Answer 1

代码scr中的语法错误应为src

<script scr="jquery-1.11.3.min.js">

应该是

<script src="jquery-1.11.3.min.js">

在HTML中特别注意愚蠢的错误，你不会有任何错误。

Answer 2

您可以调用此脚本，而不是通过JS文件突出显示此div：

<script src="jquery-1.11.3.min.js"></script>
<script>
$( document ).ready(function() {
    $('#mainArticle').addClass("highlight");
});
</script>

Answer 3

    //jQuery linked

    <script scr="jquery-1.11.3.min.js"></script>
    <script>
    //Perform Operation after jQuery Loaded
    $( document ).ready(function() {
        $('#mainArticle').addClass("highlight");
    });
    </script>

Answer 4

按照上面的建议工作，addClass完全正常。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Test Page</title>
<link href="main.css" rel="stylesheet" type="text/css">
<script src="jquery-1.11.3.min.js"></script>
 <script>
 $( document ).ready(function() {
        $('#mainArticle').addClass("highlight");
   });
    </script>
</head>
<body>
<div id="mainArticle">
<h1>This is some test code</h1>
  <p>Lots of text to test this test co</p>
</div>
</body>
</html>

Answer 5

试

// First try loading jQuery from Google's CDN
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

// Fall back to a local copy of jQuery if the CDN fails
<script>
window.jQuery || document.write('<script src="http://test.com/jquery.min.js"><\/script>'))
</script>

在你的js文件中

(function($) {

     $('#mainArticle').addClass("highlight");

})(jQuery);

Answer 6

通过浏览firebug Jquery没有定义由以下原因之一引起的此类错误： -

JS文件未正确加载您的javascript在页面完全加载之前运行您已编辑了核心Jquery文件，或者插件可能已覆盖$ variable。

通过代码，它应该是

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Test Page</title>
<link href="_css/main.css" rel="stylesheet" type="text/css">
<script language="JavaScript" type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script>
<style type="text/css">
.highlight {
background: #ffffcc;
}
</style>

</head>
<body>
<div id="mainArticle">
<h1>This is some test code</h1>
  <p>Lots of text to test this test co</p>
</div>

<script scr="jquery-1.11.3.min.js"></script>
<script src="script.js"></script>

<script type="text/javascript">
jQuery("#mainArticle").addClass("highlight");

</script>

</body>
</html>

jQuery无法正常工作 - 'jQuery在被定义之前被使用'

6 个答案: