(转)jquery each解析数组 json xml

原文:http://axl234.iteye.com/blog/1182300

jquery each解析数组： 

 var arr = [ "one", "two", "three", "four"];     
$.each(arr, function(){     
alert(this);     
});     
//上面这个each输出的结果分别为：one,two,three,four    

var arr1 = [[1, 4, 3], [4, 6, 6], [7, 20, 9]]     
$.each(arr1, function(i, item){     
alert(item[0]);     
});     
//其实arr1为一个二维数组，item相当于取每一个一维数组，   
//item[0]相对于取每一个一维数组里的第一个值   
//所以上面这个each输出分别为：1   4   7     


var obj = { one:1, two:2, three:3, four:4};     
$.each(obj, function(key, val) {     
alert(obj[key]);           
});   
//这个each就有更厉害了，能循环每一个属性     
//输出结果为：1   2  3  4    

$(function() {
          function objInit(obj) {//下拉列表框初始化
              return $(obj).html("<option>请选择</option>");
          }
          var arrData = { //定义一个数组保存相关数据
              厂商1: { 品牌1_1: "型号1_1_1,型号1_1_2", 品牌1_2: "型号1_2_1,型号1_2_2" },
              厂商2: { 品牌2_1: "型号2_1_1,型号2_1_2", 品牌2_2: "型号2_2_1,型号2_2_2" },
              厂商3: { 品牌3_1: "型号3_1_1,型号3_1_2", 品牌3_2: "型号3_2_1,型号3_2_2" }
          };

          $.each(arrData, function(pF) { //遍历数据增加厂商项
              $("#selF").append("<option>" + pF + "</option>");
          });//厂商1 厂商2 厂商3

          $("#selF").change(function() { //厂商列表框选项改变事件
              objInit("#selT");
              objInit("#selC");

              $.each(arrData, function(pF, pS) {
                  if ($("#selF option:selected").text() == pF) { //如果厂商选中项与数据匹配

                      $.each(pS, function(pT, pC) { //遍历数据增加品牌项
                          $("#selT").append("<option>" + pT + "</option>");
                      });

                      $("#selT").change(function() { //品牌列表框选项改变事件
                          objInit("#selC");
                          $.each(pS, function(pT, pC) {

                              if ($("#selT option:selected").text() == pT) { //如果品牌选中项与数据匹配

                                  $.each(pC.split(","), function() { //遍历数据增加型号项
                                      $("#selC").append("<option>" + this + "</option>");
                                  });
                              }
                          });
                      });

                  }
              });
          });

          $("#Button1").click(function() { //注册按钮单击事件
              var strValue = "您选择的厂商:";
              strValue += $("#selF option:selected").text();
              strValue += "&nbsp;您选择的品牌:";
              strValue += $("#selT option:selected").text();
              strValue += "&nbsp;您选择的型号:";
              strValue += $("#selC option:selected").text();
              $("#divTip")
              .show()
              .addClass("clsTip")
              .html(strValue); //显示提示信息并增加样式
          });
      })

jquery each解析json

json：

var data=[
  {
    "name": "陶国荣",
    "sex": "男",
    "email": "tao_guo_rong@163.com"
  },
  {
    "name": "李建洲",
    "sex": "女",
    "email": "xiaoli@163.com"
  }
]

  $(function() {
            $("#Button1").click(function() { //按钮单击事件
                //打开文件，并通过回调函数处理获取的数据
                $.getJSON("UserInfo.json", function(data) {
                    $("#divTip").empty(); //先清空标记中的内容
                    var strHTML = ""; //初始化保存内容变量
                    $.each(data, function(InfoIndex, Info) { //遍历获取的数据
                        strHTML += "姓名：" + Info["name"] + "<br>";
                        strHTML += "性别：" + Info["sex"] + "<br>";
                        strHTML += "邮箱：" + Info["email"] + "<hr>";
                    })
                    $("#divTip").html(strHTML); //显示处理后的数据
                })
            })
        })

jquery each解析xml

<?xml version="1.0" encoding="utf-8" ?>
<Info>
  <User id="1">
    <name>陶国荣</name>
    <sex>男</sex>
    <email>tao_guo_rong@163.com</email>
  </User>

  <User id="2">
    <name>李建洲</name>
    <sex>女</sex>
    <email>xiaoli@163.com</email>
  </User>
</Info>

   $(function() {
            $("#Button1").click(function() { //按钮单击事件
                //打开文件，并通过回调函数处理获取的数据
                $.get("UserInfo.xml", function(data) {
                    $("#divTip").empty(); //先清空标记中的内容
                    var strHTML = ""; //初始化保存内容变量
                    $(data).find("User").each(function() { //遍历获取的数据
                        var $strUser = $(this);
                        strHTML += "姓名：" + $strUser.find("name").text() + "<br>";
                        strHTML += "性别：" + $strUser.find("sex").text() + "<br>";
                        strHTML += "邮箱：" + $strUser.find("email").text() + "<hr>";
                    })
                    $("#divTip").html(strHTML); //显示处理后的数据
                })
            })
        })