从JSON获取第一个Src

时间:2019-03-12 10:40:39

标签: javascript json

在JSON下面,有两个src,即 image1,image2 ,现在我正在使用foreach来获取src及其x值并以javascript代码显示,但是我只需获取 first src:image1及其x值100。...

JSON

  {  
  "layers" : [
    {
      "x" : 0,
      "height" : 612,     
      "layers" : [
        {
          "x" : 0,          
          "y" : 0,         
          "name" : "L2a"
        },
        {
          "x" : 160,         
          "layers" : [
            {
              "x" : 0,            
              "src" : "image1",
              "y" : 0,              
              "name" : "L2b-1"
            },
            {

              "x" : 0,
              "y" : 0,             
              "name" : "L2b-2"
            }
          ],
          "y" : 291,         
          "name" : "user_image_1"
        },
        {
          "x" : 25,         
          "layers" : [
            {
              "x" : 0,             
              "src" : "image2",
              "y" : 0,             
              "name" : "L2C-1"
            },
            {            
              "x" : 0,
              "y" : 0,            
              "name" : "L2C-2"
            }
          ],
          "y" :22,         
          "name" : "L2"
        }
      ],
      "y" : 0, 
      "width" : 612,      
      "name" : "L1"
    }
  ]
}

let jsonData = {
  

  "layers" : [
    {
      "x" : 10,   
      "layers" : [
        {
          "x" : 20,          
          "y" : 30,         
          "name" : "L2a"
        },
        {
          "x" : 40,         
          "layers" : [
            {
              "x" : 50,            
              "src" : "image1",
              "y" : 60,              
              "name" : "L2b-1"
            },
            {
              
              "x" : 70,
              "y" : 80,             
              "name" : "L2b-2"
            }
          ],
          "y" : 90,         
          "name" : "user_image_1"
        },
        {
          "x" : 100,         
          "layers" : [
            {
              "x" : 105,             
              "src" : "image2",
              "y" : 110,             
              "name" : "L2C-1"
            },
            {            
              "x" : 120,
              "y" : 130,            
              "name" : "L2C-2"
            }
          ],
          "y" : 140,         
          "name" : "L2"
        }
      ],
      "y" : 150,      
      "name" : "L1"
    }
  ]
};

function getAllSrc(layers){
  let arr = [];
  layers.forEach(layer => {
    if(layer.src){
      arr.push({src: layer.src, x: layer.x});
    }
    else if(layer.layers){
      let newArr = getAllSrc(layer.layers);
      if(newArr.length > 0){
        newArr.forEach(({src, x}) =>{
          arr.push({src, x: (layer.x + x)});
        });
      }
    }
  });
  return arr;
}

function getData(data) {
  let arr = getAllSrc(data.layers);
  for (let {src, x} of arr){
  document.write("src :" + src);
	document.write("<br>");
	
	document.write("x:" + x);
	document.write("<br>");
  }   
  
}
getData(jsonData);

https://codepen.io/kidsdial/pen/WmZPwX

1 个答案:

答案 0 :(得分:0)

您始终可以获取数组的第一项(在本例中为对象),并显示如下信息:

function getData(data) {
  let arr = getAllSrc(data.layers)[0];

  document.write("src :" + arr.src);
  document.write("<br>");

  document.write("x:" + arr.x);
  document.write("<br>");
 }

那么您就不需要for循环,因为您只有一个对象可以迭代。