当第一次尝试对 PunkAPI 进行调用时，我尝试附加图像(url 是 JSON 中返回的对象)
append("<img src='beer[i].image_url'/>");
这不起作用，因为(从控制台)正在向 http://projectURL.com/beer[i].image_url 发出请求。而不是http://apiURL/beer[i].image_url .
我从一个在线示例中看到，如果我将对象请求括在引号和加号中，它将正常工作:
append("<img src='"+beer[i].image_url+"'/>");
我想知道的是为什么需要加号和引号。提前致谢!
完整代码如下
var request = new XMLHttpRequest();
request.open("GET", "https://api.punkapi.com/v2/beers?abv_gt=5");
request.responseType = 'json';
request.send();
request.onload = function() {
var beer = request.response;
var i;
for(i=0; i<beer.length; i++){
$("#demo").append("<img src='"+beer[i].image_url+"' />");
}
};
<body>
<div id="demo">
</div>
</body>
<script
src="https://code.jquery.com/jquery-3.3.1.min.js"
integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
crossorigin="anonymous"></script>最佳答案
问题是，如果您不使用引号和加号来连接字符串，那么 JavaScript 将不知道您正在尝试连接变量值以将其用作最终字符串的一部分，并将其解释为简单的字符串字符串。
因此您需要按如下方式连接变量:
append("<img src='"+beer[i].image_url+"'/>");
或者在 es6 中，您可以使用反引号引用的字符串进行变量替换:
let source = beer[i].image_url;
append(`<img src="${source}" />`);
关于javascript - 从 JSON 调用对象的值时，为什么必须用引号和加号括起来？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/50769033/