javascript - 为什么我的 javascript 代码读取此 json 数据的 null 属性？

Question

编辑:抱歉，代码中充满了错误。现在改了

我一直在尝试从 github 链接中提取一些 JSON 数据以将其放入 html 文件中，但每次我尝试这样做(使用下面的代码)时，我都会收到一个 Uncaught TypeError: cannot read property "value"of无效的。即使“值”(在 Json 文件中)肯定不为空。

这里出了什么问题？

谢谢

你可以看看我放在github上的json文件https://github.com/BearsAreFriendly/PolitiekeHelderheid/blob/master/kamerleden.json .我很确定“值(value)”已经被定义

  var section = document.querySelector("section");
  var requestURL = 'https://github.com/BearsAreFriendly/PolitiekeHelderheid/blob/master/kamerleden.json';
  var request = new XMLHttpRequest();
  request.open('GET', requestURL);
  request.responseType = 'json';
  request.send();

  request.onload = function(){
    var phdata = request.response;
    showKamerleden(phdata);
  }
  function showKamerleden(jsonObj) {
  var kamerleden = jsonObj["value"];
  for (var i = 0; i < kamerleden.length; i++) {
      var myPara1 = document.createElement('p');
      myPara1.textContent = kamerleden[i].Id;
      section.appendChild(myPara1);
  }
  }

这应该打印出 id。相反，我得到了我提到的错误代码

Answer 1

我相信您实际上可能没有从 GitHub 接收任何 JSON 数据，而是 HTML。当我的浏览器请求 GitHub 页面时，响应内容类型为 Content-Type: text/html。您的请求 URL 应该以 JSON 响应，以便它可用。当您请求 GitHub URL 时，您可能会得到其他内容(例如 HTML)，但不会得到 JSON。

例如，此 url 仅提供 JSON 数据:https://my-json-server.typicode.com/typicode/demo/posts

当我在网络部分下的开发工具中检查页面时，它有 Content-Type: application/json

修改您的代码以添加下面的 url 效果很好。

var section = document.querySelector("section");
  var requestURL = 'https://my-json-server.typicode.com/typicode/demo/posts';
  var request = new XMLHttpRequest();
  request.open('GET', requestURL);
  request.responseType = 'json';
  request.send();
  
  request.onload = function(){
    var phdata = request.response;
    /* showKamerleden(phdata); */
  document.write(JSON.stringify(phdata) ) 

  }