Javascript 访问json数组元素的动态方式
所以我有json数组Javascript 访问json数组元素的动态方式,javascript,html,json,Javascript,Html,Json,所以我有json数组 data = '[{"beatles": [ {"name":"Paul McCartney","value": "http://www.paulmccartney.com"}, {"name": "John Lennon","value": "http://www.johnlennon.it"}, {"name":"George Harrison","value": "http
data = '[{"beatles": [
{"name":"Paul McCartney","value": "http://www.paulmccartney.com"},
{"name": "John Lennon","value": "http://www.johnlennon.it"},
{"name":"George Harrison","value": "http://www.georgeharrison.com"},
{"name": "Ringo Starr","value": "http://www.ringostarr.com"}],
"stones": [
{"name": "Mick Jagger","value": "http://www.mickjagger.com"},
{"name": "Keith Richards","value": "http://www.keithrichards.com"}]'
我有两个下拉列表
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script src="rockbands.json"></script>
<script src="script.js"></script>
</head>
<body onload="getBands()">
<select id="bands" onchange="getNames(this.value)"></select>
<select id="names" ></select>
</body>
</html>
我要做的是用ID“names”填充另一个下拉列表
使用基于第一个下拉列表中的选择的数组元素“name”,例如,如果我选择beatles,它将加载beatles中的所有名称
我可以用root[0]之类的东西来访问它。披头士[1]。名称,但我需要一种动态的方式来访问它们。谢谢基于:
属性访问器通过使用提供对对象属性的访问
点符号或括号符号
这意味着您还可以访问诸如root[0]['beatles'][1]['name']
之类的属性
由于“披头士”是一个类似于属性的字符串,它也可以是一个变量:
root[0][band\u name][1][name']
在getNames()函数中执行以下操作
function getNames(nameOfBand) {
var root = JSON.parse(data);
var namesBox = document.getElementById("names");
var listOfNames = root[0][nameOfBand]
for( j = 0; j < listOfNames.length; j++) {
var option = document.createElement("option");
option.text = listOfNames[j]["name"];
namesBox.appendChild(option)
}
}
函数getNames(nameOfBand){
var root=JSON.parse(数据);
var namesBox=document.getElementById(“名称”);
var listOfNames=root[0][nameOfBand]
对于(j=0;j
这不是一个json数组,而是一个字符串。啊,是的,对不起,json字符串就是我的意思--
object.property
object["property"]
function getNames(nameOfBand) {
var root = JSON.parse(data);
var namesBox = document.getElementById("names");
var listOfNames = root[0][nameOfBand]
for( j = 0; j < listOfNames.length; j++) {
var option = document.createElement("option");
option.text = listOfNames[j]["name"];
namesBox.appendChild(option)
}
}