如何使用jQuery调用股票API获取收盘价并展示到网页

你照搬官方示例代码不生效的原因很简单：官方示例调用的是批量获取多日K线的/eod接口，返回的行情数据存在data字段的数组里；但你用的是获取单日最新行情的/eod/latest接口，返回结果是单个对象，所有行情字段直接在响应根节点，没有外层data数组，所以你写的数组判断、遍历逻辑根本不会触发。

首先在页面里加一个用来显示价格的DOM容器，然后写请求逻辑即可：

<!-- 行情展示区域 -->
<div>
  <h3>劳埃德银行（LLOY.XLON）日终收盘价</h3>
  <p>交易日期：<span id="eod-date"></span></p>
  <p>收盘价：<span id="eod-close"></span></p>
</div>

<!-- 请提前在页面引入jQuery库 -->
<script>
$.ajax({
  url: 'https://api.marketstack.com/v1/tickers/LLOY.XLON/eod/latest',
  data: {
    access_key: '替换为你自己的API密钥'
  },
  dataType: 'json',
  success: function(response) {
    // 直接从响应根节点取收盘价，存为变量
    const closePrice = response.close;
    const tradeDate = response.date;

    // 将数据插入页面对应位置
    $('#eod-close').text(closePrice);
    $('#eod-date').text(tradeDate.slice(0, 10)); // 截取日期字符串前10位，只显示年月日
  },
  error: function() {
    $('#eod-close').text('数据加载失败');
  }
});
</script>

• 如果需要展示其他行情字段，直接从response里取对应key就行，比如response.open是开盘价、response.high是最高价、response.low是最低价、response.volume是成交量。
• 你之前写的移除数组判断后的版本有语法错误：success回调函数只写了声明，没写函数体就直接闭合了，自然不会执行任何逻辑。
• 学校项目演示可以直接把密钥写在前端，正式上线的话不要把API密钥暴露在前端代码里，容易被人盗用额度，最好加一层后端代理转发请求。

内容的提问来源于stack exchange，提问作者T. Sproull