Question

我正在尝试从api中检索数据并使用它来填充ID为“output”的div。我得到一个错误，$ $未定义。任何人都可以帮助确定我缺少的东西吗？

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="Content-Script-Type" content="text/javascript">
<meta name="Content-Style-Type" content="text/css">
</head>

<body style="margin: 0px; padding: 0px;">

<div id="fullscreen">
<div id="output">

</div>

</div>

</body>
<script>
$.ajax({
type: 'GET',
url: "https://apiurl.com",
dataType: "json",
crossDomain: true,
success: function( response ) {
        console.log( response ); // server response
        var id = response[0];       
        var vname = response[1];
        $('#output').html("<b>id: </b>"+id+"<b> name: </b>"+vname);
}
});
</script>
</html>

Answer 1

正如Sirko已在评论中解释的那样，您正在尝试使用javascript库JQuery，但由于您没有包含该库，因此该库不可用。

您可以通过下载JQuery here并通过

包含它来包含它

<script src="src_to_local_jquery.js"/>

或将其包含在外部（在上面链接的CDN部分中描述）

另请注意，脚本标签应放在头部或主体部分。要确保在页面准备就绪后执行自定义脚本，可以使用JQuery's document ready方法。

Answer 2

$符号不是JavaScript语言的一部分，它是第三方库jQuery（$ === jQuery）的简写。

您需要在html文件中将其作为依赖项添加到脚本标记中，其中src属性包含源文件的URI，然后才能使用它。

<html>
  <head></head>
  <body>
    ...
    ...
    <script src="//code.jquery.com/jquery-3.1.1.js"></script>
    <script>
       $(function () {
         // Your code here
       });
    </script>
  </body>
</html>

Answer 3

将jQuery包括为CDN或在本地下载添加引用。然后在拨打电话之前确保DOM已准备就绪。您可以阅读有关here

的更多信息

<script src="local_jquery.js"/>
// OR
<script src="https://code.jquery.com/jquery-3.1.1.js"></script>


$(function() {
  $.ajax({
    type: 'GET',
    url: "https://apiurl.com",
    dataType: "json",
    crossDomain: true,
    success: function( response ) {
        console.log( response ); // server response
        var id = response[0];       
        var vname = response[1];
        $('#output').html("<b>id: </b>"+id+"<b> name: </b>"+vname);
    }
   });
});

从api调用json数据

3 个答案: