我具有以下JSON结构:
[{ "id":"10", "class": "child-of-9" }, { "id": "11", "classd": "child-of-10" }]
如何使用JavaScript进行迭代?
我具有以下JSON结构:
[{ "id":"10", "class": "child-of-9" }, { "id": "11", "classd": "child-of-10" }]
如何使用JavaScript进行迭代?
使用jQuery时,侯爵王很可能是最好的答案。
使用JavaScript的forEach
方法,这在纯JavaScript中非常相似。forEach接受一个函数作为参数。然后将针对数组中的每个项目调用该函数,并以所述项目作为参数。
简短易行:
<script>
var results = [ {"id":"10", "class": "child-of-9"}, {"id":"11", "classd": "child-of-10"}];
results.forEach( function( item ) {
console.log( item );
});
</script>
这是一个纯注释的JavaScript示例。
<script language="JavaScript" type="text/javascript">
function iterate_json(){
// Create our XMLHttpRequest object
var hr = new XMLHttpRequest();
// Create some variables we need to send to our PHP file
hr.open("GET", "json-note.php", true);//this is your php file containing json
hr.setRequestHeader("Content-type", "application/json", true);
// Access the onreadystatechange event for the XMLHttpRequest object
hr.onreadystatechange = function() {
if(hr.readyState == 4 && hr.status == 200) {
var data = JSON.parse(hr.responseText);
var results = document.getElementById("myDiv");//myDiv is the div id
for (var obj in data){
results.innerHTML += data[obj].id+ "is"+data[obj].class + "<br/>";
}
}
}
hr.send(null);
}
</script>
<script language="JavaScript" type="text/javascript">iterate_json();</script>// call function here
您可以使用像物objx一个迷你图书馆- http://objx.googlecode.com/
您可以编写如下代码:
var data = [ {"id":"10", "class": "child-of-9"},
{"id":"11", "class": "child-of-10"}];
// alert all IDs
objx(data).each(function(item) { alert(item.id) });
// get all IDs into a new array
var ids = objx(data).collect("id").obj();
// group by class
var grouped = objx(data).group(function(item){ return item.class; }).obj()
还有更多“插件”可用于处理此类数据,请参见http://code.google.com/p/objx-plugins/wiki/PluginLibrary
从http://www.w3schools.com复制和粘贴,不需要JQuery开销。
var person = {fname:"John", lname:"Doe", age:25};
var text = "";
var x;
for (x in person) {
text += person[x];
}
结果:John Doe 25
var arr = [ {"id":"10", "class": "child-of-9"}, {"id":"11", "classd": "child-of-10"}];
for (var i = 0; i < arr.length; i++){
var obj = arr[i];
for (var key in obj){
var attrName = key;
var attrValue = obj[key];
}
}
var arr = [ {"id":"10", "class": "child-of-9"}, {"id":"11", "class": "child-of-10"}];
for (var i = 0; i < arr.length; i++){
document.write("<br><br>array index: " + i);
var obj = arr[i];
for (var key in obj){
var value = obj[key];
document.write("<br> - " + key + ": " + value);
}
}
注意:for-in方法对于简单对象很酷。与DOM对象配合使用不是很聪明。
如果这是您的dataArray
:
var dataArray = [{"id":28,"class":"Sweden"}, {"id":56,"class":"USA"}, {"id":89,"class":"England"}];
然后:
$(jQuery.parseJSON(JSON.stringify(dataArray))).each(function() {
var ID = this.id;
var CLASS = this.class;
});
取自jQuery docs:
var arr = [ "one", "two", "three", "four", "five" ];
var obj = { one:1, two:2, three:3, four:4, five:5 };
jQuery.each(arr, function() {
$("#" + this).text("My id is " + this + ".");
return (this != "four"); // will stop running to skip "five"
});
jQuery.each(obj, function(i, val) {
$("#" + i).append(document.createTextNode(" - " + val));
});
导航JSON文档的另一种解决方案是JSONiq(在Zorba引擎中实现),您可以在其中编写类似以下内容的内容:
您可以在http://try.zorba.io/上运行它