Question

如何在不使用eval的情况下使用Javascript获取数据值？

jsonFlickrFeed({
    "title": "Recent Uploads tagged punctuation and atsign",
    "link": "http:\/\/www.flickr.com\/photos\/",
    "description": "",
    "modified": "2014-01-09T15:40:57Z",
    "generator": "http:\/\/www.flickr.com",
    "items": [
   {
   .....
   .....

Answer 1

基本上有人可以告诉我如何从这个网址解析数据吗？ http://www.flickr.com/services/feeds/photos_public.gne?tags=punctuation,atsign&format=json

你并不打算解析。这是一个老派的JSONP回复。无论如何，必须对其进行评估。历史上，JSONP用于执行CORS（跨域资源共享），其中不可能使用正确的CORS。

您必须在程序中定义jsonFlickrFeed，然后

<script type="application/javascript"
        src="http://www.flickr.com/services/feeds/photos_public.gne?tags=punctuation,atsign&format=json">
</script>

这将导致使用数据对象调用jsonFlickrFeed。

注意：这里滥用了术语JSON，因为jsonFlickrFeed实际上是在接受JavaScript对象;不是JSON 字符串。

JSONP回调：通常，您可以通过将&callback=foo传递给JSONP请求来配置回调的名称。我使用您提供的flickr URL尝试了这一点，但它们的API以某种方式运行不同或不支持用户命名的回调。检查他们的API，看看是否可以按照合理的命名约定指定回调。

这是一个功能齐全的演示，向您展示它的工作方式。我们将3个响应数据写入控制台; title，link和modified。显然，你可以用数据做任何你想做的事。

<script>
  function jsonFlickrFeed (data) {
    console.log("title", data.title)
    console.log("link", data.link)
    console.log("modified", data.modified)
  }
</script>

<script type="application/javascript"
        src="http://www.flickr.com/services/feeds/photos_public.gne?tags=punctuation,atsign&format=json">
</script>

这是另一个显示items属性

中图像的演示

body {
  display: flex;
  flex-direction: row;
}

img {
  display: flex;
  max-height: 50px;
}

<script>
  function makeImage (src) {
    return Object.assign(document.createElement('img'), {src})
  }
  
  function jsonFlickrFeed (data) {
    for (let {media: {m}} of data.items)
      document.body.appendChild(makeImage(m))
  }
</script>

<script type="application/javascript"
        src="http://www.flickr.com/services/feeds/photos_public.gne?tags=punctuation,atsign&format=json">
</script>

在任何一个示例中，请注意我不必手动解析任何内容。这里没有JSON，因此无需解析。

Answer 2

根据您在下面的评论，您有以下代码：

var request = new XMLHttpRequest(); 
request.open("GET", "json/flickr.json", false); 
request.send(null) 
var response_object = (request.response); 
console.log(response_object); 
function jsonFlickrFeed(json){ 
   var obj = JSON.parse(json); 
   console.log(obj); 
}

问题是响应不是100％格式正确的JSON。主要内容嵌入在似乎是函数调用的内容中：

`jsonFlickrFeed(main content here)`

您必须删除该包装，然后您可以在剩余的字符串上使用JSON.parse：

   var response_object = request.responseText.replace("jsonFlickrFeed(", "").substr(0,str.length-1));
   var obj = JSON.parse(response_object);

此外，根据您显示的代码，您还没有为XHR完成时设置load回调。

如何使用JAVASCRIPT获取数据值

2 个答案: