我想从以下网址输出lyrics_body密钥的数据。API Link
但该URL上的JSON文本如下所示。
{
"message": {
"header": {
"status_code": 200,
"execute_time": 0.0047609806060791
},
"body": {
"lyrics": {
"lyrics_id": 16894378,
"can_edit": 0,
"locked": 0,
"published_status": 8,
"action_requested": "",
"verified": 0,
"restricted": 0,
"instrumental": 0,
"explicit": 1,
"lyrics_body": "Kis Tarah Main Bataoon\nKee Adhura Main Hoon\nYah
Yakeen Dilaoon\nBana Tere Lie Hee Main Hoon\nMamam. Ab Yah Hee Hai
Meree Khvaahish\nIs Pal Ko Toh Main Jee Loon\n\nTu Iss Jagah Hai
Khada\nPhir Bhi Hai Door Tu Haan\nKuch Na Raha Darmiyaan\nPhir Kyun
Dil Keh Raha\n\nO Saathi…Itna Toh Bas Kar De\n...\n\n******* This
Lyrics is NOT for Commercial use *******",
"lyrics_language": "",
"lyrics_language_description": "",
"lyrics_copyright": "Lyrics powered by www.musixmatch.com. This Lyrics
is NOT for Commercial use and only 30% of the lyrics are returned.",
"writer_list": [],
"publisher_list": [],
"backlink_url": "https://www.musixmatch.com/lyrics/Arijit-Singh/O-
Saathi?utm_source=application&utm_campaign=api&utm_medium=",
"updated_time": "2017-07-26T07:05:50Z"
}
}
}
}
现在我怎样才能将lyrics_body
键中的文本输出到具有id="result"
的div元素。我尝试了很多方法但没有输出。
答案 0 :(得分:1)
通过点表示法访问嵌套的json
键:json.message.body.lyrics.lyrics_body
。
使用.innerText
将文字附加到元素。使用.getElementById("")
按id
属性查找元素。
var json = {
"message": {
"header": {
"status_code": 200,
"execute_time": 0.0047609806060791
},
"body": {
"lyrics": {
"lyrics_id": 16894378,
"can_edit": 0,
"locked": 0,
"published_status": 8,
"action_requested": "",
"verified": 0,
"restricted": 0,
"instrumental": 0,
"explicit": 1,
"lyrics_body": "Kis Tarah Main Bataoon\nKee Adhura Main Hoon\nYah Yakeen Dilaoon\nBana Tere Lie Hee Main Hoon\nMamam. Ab Yah Hee Hai Meree Khvaahish\nIs Pal Ko Toh Main Jee Loon\n\nTu Iss Jagah Hai Khada\nPhir Bhi Hai Door Tu Haan\nKuch Na Raha Darmiyaan\nPhir Kyun Dil Keh Raha\n\nO Saathi…Itna Toh Bas Kar De\n...\n\n******* This Lyrics is NOT for Commercial use *******",
"lyrics_language": "",
"lyrics_language_description": "",
"lyrics_copyright": "Lyrics powered by www.musixmatch.com. This Lyrics is NOT for Commercial use and only 30% of the lyrics are returned.",
"writer_list": [],
"publisher_list": [],
"backlink_url": "https://www.musixmatch.com/lyrics/Arijit-Singh/O-Saathi?utm_source=application&utm_campaign=api&utm_medium=",
"updated_time": "2017-07-26T07:05:50Z"
}
}
}
}
document.getElementById("result").innerText = json.message.body.lyrics.lyrics_body;
<div id="result"></div>
答案 1 :(得分:1)
通过.getJSON获取JSON。解析后将#result解析为data.message.body.lyrics.lyrics_body
var url = 'https://crossorigin.me/https://api.musixmatch.com/ws/1.1/matcher.lyrics.get?callback=format=jsonp&q_track=O%20Saathi&q_artist=Arijit%20Singh&apikey=c12b7dffb9a86d5b6d70e0f0fdeab589'
$.getJSON(url, function(data) {
$('#result').text(data.message.body.lyrics.lyrics_body);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="result">#Result</div>
答案 2 :(得分:1)
$( "#target" ).click(function() {
var url = 'https://crossorigin.me/https://api.musixmatch.com/ws/1.1/matcher.lyrics.get?callback=format=jsonp&q_track=O%20Saathi&q_artist=Arijit%20Singh&apikey=c12b7dffb9a86d5b6d70e0f0fdeab589'
$.getJSON(url, function(result) {
console.log(result.message.body.lyrics.lyrics_body)
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="target">
Click here
</div>
<div id='data'></div>
答案 3 :(得分:0)
首先,您需要将这些数据存储到变量中。
var myData = {
//your json data
}
然后console.log(myData.message.body.lyrics.lyrics_body)
看看你是否得到了正确的价值。