因此，因为我喜欢组织我的代码，所以我在互联网上搜索了如何将 jQuery 加载到 JS 文件中，以便我可以将该 JS 文件加载到 html 文件中并在 JS 文件中单独工作。我在网上找到了一个优雅的解决方案并应用了它，当我检查是否加载了 jQuery 时它起作用了，但是当我试图从 div 中找到一个类时它不起作用。它给我“$ is not difined”错误。为什么？检查表明 jQuery 已加载。
JS代码:
var script = document.createElement('script');
script.src = 'https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js';
script.type = 'text/javascript';
document.getElementsByTagName('head')[0].appendChild(script);
window.onload = function()
{
if (window.jQuery)
{
alert('jQuery is loaded');
}
else
{
alert('jQuery is not loaded');
}
}
$('.spectacle').click(function(){
alert('plm');
});
HTML代码:
<!DOCTYPE html>
<html>
<head>
<title>Spectacole</title>
<link rel="stylesheet" type="text/css" href="Spectacole.css">
</head>
<body>
<div id="top-bar">
<div id="bar-background"></div>
<a href="../StartingPage/startingPage.html"><button
id="mainMenu">
</button></a>
</div>
<div id="wrapper">
<div class="spectacle">
</div>
<div class="spectacle">
</div>
<div class="spectacle">
</div>
<div class="spectacle">
</div>
<div class="spectacle">
</div>
<div class="spectacle">
</div>
<div class="spectacle">
</div>
</div>
<script type="text/javascript" src="Spectacole.js"></script>
</body>
</html>
最佳答案
添加
$('.spectacle').click(function(){
alert('plm');
});
在 window.onload = function(){ } 中
var script = document.createElement('script');
script.src = 'https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js';
script.type = 'text/javascript';
document.getElementsByTagName('head')[0].appendChild(script);
window.onload = function()
{
if (window.jQuery)
{
alert('jQuery is loaded');
}
else
{
alert('jQuery is not loaded');
}
$('.spectacle').click(function(){
alert('plm');
});
}.spectacle {
height:50px;
width:50px;
background:#000;
border:1px solid #fff;
}<!DOCTYPE html>
<html>
<head>
<title>Spectacole</title>
<link rel="stylesheet" type="text/css" href="Spectacole.css">
</head>
<body>
<div id="top-bar">
<div id="bar-background"></div>
<a href="../StartingPage/startingPage.html"><button
id="mainMenu">
</button></a>
</div>
<div id="wrapper">
<div class="spectacle">
</div>
<div class="spectacle">
</div>
<div class="spectacle">
</div>
<div class="spectacle">
</div>
<div class="spectacle">
</div>
<div class="spectacle">
</div>
<div class="spectacle">
</div>
</div>
<script type="text/javascript" src="Spectacole.js"></script>
</body>
</html>关于jquery - 为什么说 $ 未定义？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/54055075/