我有这个数据读取到我的控制台.我想显示"exampleHeader"和“;exampleBody&q
I have this data reading into my Console. I want to display the "exampleHeader" and "exampleBody" in my webpage. How would I do so?
我正在将数据拉入我的控制台。我现在想在我的网站上显示数据,但不知道如何开始。如何在我的网站中显示"exampleHeader"answers"exampleBody"?
这就是我如何在数据加载到控制台
<script>
var request = new XMLHttpRequest();
request.open('GET', 'https://cdn.contentful.com/spaces/clc9cijcjmcd/entries?access_token=9802c47cdeb2e40562f5a4a05dd75f53088b7552b498c176ec9126ceb30d0f2c', true);
request.onreadystatechange = function () {
if (this.readyState === 4) {
console.log('Status:', this.status);
console.log('Headers:', this.getAllResponseHeaders());
console.log('Body:', this.responseText);
}
};
request.send();
</script>
我试图加载它到一个div与id=demo
Body: {
"sys": {
"type": "Array"
},
"total": 1,
"skip": 0,
"limit": 100,
"items": [
{
"sys": {
"space": {
"sys": {
"type": "Link",
"linkType": "Space",
"id": "clc9cijcjmcd"
}
},
"type": "Entry",
"contentType": {
"sys": {
"type": "Link",
"linkType": "ContentType",
"id": "68UcXjdLs4ueKuaCwSCiqI"
}
},
"id": "4Jy6Vc0R9u4CcoWEECASKO",
"revision": 2,
"createdAt": "2015-07-06T16:24:36.055Z",
"updatedAt": "2015-07-07T18:04:38.570Z",
"locale": "en-US"
},
"fields": {
"exampleHeader": "Header For Example",
"exampleBody": "I really wish i could copy and paste into her but it wont let me for some reason . 'n1. List One'n2. List Two'n",
"photo": {
"sys": {
"type": "Link",
"linkType": "Asset",
"id": "5SWcsSwJbOmQcyC8gCKkeo"
}
}
}
}
]
}
"includes": {
"Asset": [
{
"sys": {
"space": {
"sys": {
"type": "Link",
"linkType": "Space",
"id": "clc9cijcjmcd"
}
},
"type": "Asset",
"id": "5SWcsSwJbOmQcyC8gCKkeo",
"revision": 1,
"createdAt": "2015-07-06T16:24:21.141Z",
"updatedAt": "2015-07-06T16:24:21.141Z",
"locale": "en-US"
},
"fields": {
"title": "Man on The Moon",
"description": "Album Cover",
"file": {
"fileName": "cdMoon.jpg",
"contentType": "image/jpeg",
"details": {
"image": {
"width": 755,
"height": 746
},
"size": 145782
},
"url": "//images.contentful.com/clc9cijcjmcd/5SWcsSwJbOmQcyC8gCKkeo/c6dd2a4ebdbfdd45350969b0eed82f39/cdMoon.jpg"
}
}
}
]
}
}
需要将返回的JSON字符串解析为JavaScript对象,如下所示。然后将该对象传递给一个函数,该函数将获取标题文本并将其插入页面上的元素中。
var request = new XMLHttpRequest();
request.open('GET', '<url>', true);
request.onreadystatechange = function () {
if (this.readyState === 4) {
insertInDiv( JSON.parse(this.responseText) );
}
};
request.send();
function insertInDiv(data) {
// Grabbing header text
var bodyText = data.items[0].fields.exampleHeader;
// Example of inserting text into first div on page
document.getElementById('demo').innerHTML = bodyText;
}
相关文章:
- 铬:“;未捕获的语法错误:意外的标记:"
- 可以设置“;文件名"发生错误时显示的内联脚本标记的
- JS表单提交"无法使用Chrome数据保护程序加载此页面.尝试重新加载页面.调试信息:POST CISmtuK
- 检测电话窃听,即:<a href="电话:xxx">在UIWebview上
- 使用“+="操作人员
- //而不是在src=“”上使用http://"属性
- "未捕获的语法错误:意外的标记}"
- 可以<脚本类型=“;text/javascript”>window.location=“/"</
- "实例范围”;TypeScript类的getter/setter
- Javascript复选框函数:;缺少:在属性id之后"
- "“;变量未引用正确的对象
- "日期“;AJAX请求返回的类型值未定义
- 得到"TypeError:无法读取属性'filename'未定义的“;调用“npm start
- Soundcloud api"未捕获的类型错误:无法读取属性'uri'“未定义”;
- "工具提示"jQuery插件坏了
- "锻造;React中的表达式
- 图像可以从源<img src=""/>.TEXT可以在没有javascript的情况下从外部
- 如何提取“;href"最近列表项中的属性值
- CKEditor如何允许href="javascript:void(0)"在小部件中
- 插入“;img src"在javascript中