Выберите по названию в объекте

Question

Прежде всего, я все еще учусь, пожалуйста, будьте осторожны :) У меня есть ответ json, где я хочу выбрать некоторые конкретные элементы. Я пытаюсь получить некоторые элементы с определенным именем внутри объекта и хочу проверить, соответствует ли оно предопределенному имени. Это спецификации продукта с определенным именем типа «длина», «ширина» и т. Д.

У меня возникли проблемы с поиском этих конкретных имен, и если они найдены, получите их атрибут «значение».

Так что у меня есть это:

JSON ответ:

{ 

"product": { 
    "specs": { 

     "231638": { 
     "id": 231638, 
     "title": "Length (mm)", 
     "value": "1200" 
    }, 
    "231641": { 
     "id": 231641, 
     "title": "Width (mm)", 
     "value": "800" 
    }, 
     "231644": { 
     "id": 231644, 
     "title": "Height (mm)", 
     "value": "144" 
    } //etc etc 

Теперь я хочу, чтобы захватить только два value атрибуты из спецификации «длина» и «высота». Поэтому сначала я должен посмотреть, присутствуют ли эти два имени и соответствуют ли они «длина» и «высота», и, если так, возьмите их атрибуты value. Вот где мне нужна помощь.

Конечный результат должен быть

<div class="somediv"> 
<span class="width">1200</span> 
<span class="height">144</span> 
</div> 

Так что у меня есть это:

$.getJSON(url', function(data){ 
     var specsHtml = []; 

     $.each(data.product.specs, function(index, spec){ 
     // in here I need to test if the name of the spec equals "length or Height". 
     specsHtml.push(spec.value); 
     }); 
     specsHtml = specsHtml.join(''); 
     } 
    container.find('.product-bottom .measurements span').html(specsHtml); 
}); 

Я укомплектовать застрял здесь. Я пытался что-то вроде:

(spec.hasOwnProperty("title")); 

или

var specs = []; 
     data.product.specs.forEach(data.product.specs => { 
     if (data.product.specs) 
     for (var spec in data.product.specs) 
      specs.push(spec); 
     }) 

Любая помощь очень ценится :)

Answer 1

var data = { 
 
    "product": { 
 
    "specs": { 
 
     "231638": { 
 
     "id": 231638, 
 
     "title": "Length (mm)", 
 
     "value": "1200" 
 
     }, 
 
     "231641": { 
 
     "id": 231641, 
 
     "title": "Width (mm)", 
 
     "value": "800" 
 
     }, 
 
     "231644": { 
 
     "id": 231644, 
 
     "title": "Height (mm)", 
 
     "value": "144" 
 
     } //etc etc 
 
    } 
 
    } 
 
}; 
 

 
var length = 0, width = 0, height = 0, 
 
    reLength = /length/i, 
 
    reWidth = /width/i, 
 
    reHeight = /height/i; 
 
$.each(data.product.specs, function (specId, spec) { 
 
    if (reLength.test(spec.title)) 
 
    length = spec.value; 
 
    else if (reWidth.test(spec.title)) 
 
    width = spec.value; 
 
    else if (reHeight.test(spec.title)) 
 
    height = spec.value; 
 
}); 
 

 
var html = '<div class="somediv">' + 
 
    '<span class="width">w: ' + width + '</span>' + 
 
    '<span class="height">h: ' + height + '</span>' + 
 
    '<span class="length">l: ' + length + '</span>' + 
 
    '</div>'; 
 
$(document.body).html(html);

.somediv > span { padding: 10px; display:inline-block; }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Answer 2

$.getJSON(url, function(data){ 
     var specsHtml = "<div class="somediv">"; 

     $.each(data.product.specs, function(){ 
     //'this' is now your current 'spec' which is { "id": ..., "title": ..., etc. } 
     specsHtml += '<span class=\"'; 
     if (this.title.includes('Length')) 
      specsHtml += 'length'; 
     else 
      specsHtml += 'width'; 

     specsHtml = specsHtml + '\">' + this.value + '</span>'; 
     }); 
     specsHtml += '</div>'; 
     } 
    container.find('.product-bottom .measurements span').html(specsHtml); 
});