Как использовать переменные при вызове значений JSON?

Question

У меня есть сценарий, который преобразует XML в "JSON". Доступные данные можно получить, используя styles.Default.FontName (например). Однако вместо того, чтобы вручную вставлять «Default» в эту строку, мне нужно иметь возможность использовать переменную. Мне нужно иметь возможность использовать множество разных комбинаций «styles.XXXX.XXXX».

Вот мой сценарий функция convertData (XML) {

var styles = {} 

    $(xml).find('Style').each(function() { 

    var id = $(this).attr('ss:ID'); 
    var name = $(this).attr('ss:Name'); 
    var type = $(this).children(); 

    var style = {}; 

    styles[id] = style; 

    style['Name'] = name; 

    type.each(function() { 

     $.each(this.attributes, function() { 

     if (this.specified) { 
      style[stripPrefix(this.name)] = this.value; 
     } 

     }); 

    });; 

    // You can now use 'styles.s57.FontName' and the like to return values :) 

    }); 

    $(xml).find('Worksheet').each(function() { 
    var name = $(this).attr('ss:Name'); 
    var data = $(this).find('Data'); 

    data.each(function() { 
     var cell = $(this).parent('Cell'); 
     var value = $(this).text(); 
     var styleId = cell.attr('ss:StyleID'); 
     $(window).load(function() { 
     // Here is my issue (see below for working calls...) 
     // This guy doesn't work (because of the 'styleId' variable not being an actual style id like 's57') 
     $('.testing').append('<span class="color:#f60;">' + styles.styleId.Color + '</span>'); 
     }); 
    }); 

    }); 

    $(document).ready(function() { 

    $('body').append('<div class="testing"/>'); 

    // Works fine 
    $('.testing').html(styles.Default.FontName); 
    $('.testing').append(styles.s59.Bold); 

    $('body').append('<div class="json-output"/>'); 
    $('.json-output').append(JSON.stringify(styles)); 

    for (var i in styles) { 
     console.log(i); 
    } 

    }); 

} 

Итак, как я могу использовать переменную здесь вместо указания 'по умолчанию' или 'S59'? Любая помощь очень ценится!

Чтобы пояснить, что я прошу ... Использование **styles.Default.FontName** работает нормально. Мне просто нужно иметь возможность динамически менять «По умолчанию» с переменной. Зачем? Потому что я буду использовать эти внутренние циклы, которые повторяются через «Ячейки», каждая из которых имеет разные «StyleID». Этот цикл показан выше через data.each(). Таким образом, каждая итерация может быть связана с другим «StyleID».

Но когда я использую styles.SomeVariable.SomeStyle, вместо того, чтобы вставить какое значение я поставил 'SomeVariable', он ссылается на объект JSON для "SomeVariable" ...

UPDATE:

jsFiddle

Для справочно сгенерированного JSON

{ 
    "Default":{ 
    "Name":"Normal", 
    "Vertical":"Bottom", 
    "FontName":"Calibri", 
    "Family":"Swiss", 
    "Size":"11", 
    "Color":"#000000" 
    }, 
    "s57":{ 
    "Name":"Hyperlink", 
    "FontName":"Calibri", 
    "Family":"Swiss", 
    "Size":"11", 
    "Color":"#0066CC", 
    "Underline":"Single" 
    }, 
    "s58":{ 
    "Horizontal":"Left", 
    "Vertical":"Center", 
    "Indent":"1" 
    }, 
    "s59":{ 
    "Vertical":"Center", 
    "WrapText":"1", 
    "FontName":"Calibri", 
    "Family":"Swiss", 
    "Size":"11", 
    "Color":"#000000", 
    "Bold":"1" 
    } 
} 

Answer 1

ли это так же, как вы назначаете свойства объекта, используя [] обозначения

var someVal = object[variable]; 

Вы также можете комбинировать типы обозначения

var someVal = object[variable][anotherVariable].someProperty; 

Answer 2

Edit, Изменено

Попробуйте заменить var styleId = cell.data('styleid'); для var styleId = cell.data('styleID'); ; поскольку имя атрибута data-* преобразуется в нижний регистр.

См jquery get HTML 5 Data Attributes with hyphens and Case Sensitivity

Примечание, undefined вернулся в s58, где нет имени свойства Color.

jsfiddle http://jsfiddle.net/yao01h4b/10/

---

Попробуйте

var name = "styleId" 
, option = {}; 
option[name] = styles.s57; 

var styleId = $.extend(styles, option); 
// do stuff with `styles.styleId.s57` 
document.write(styles.styleId.FontName); 

См jQuery.extend()

---

var styles = { 
 
    "Default":{ 
 
    "Name":"Normal", 
 
    "Vertical":"Bottom", 
 
    "FontName":"Calibri", 
 
    "Family":"Swiss", 
 
    "Size":"11", 
 
    "Color":"#000000" 
 
    }, 
 
    "s57":{ 
 
    "Name":"Hyperlink", 
 
    "FontName":"Calibri", 
 
    "Family":"Swiss", 
 
    "Size":"11", 
 
    "Color":"#0066CC", 
 
    "Underline":"Single" 
 
    }, 
 
    "s58":{ 
 
    "Horizontal":"Left", 
 
    "Vertical":"Center", 
 
    "Indent":"1" 
 
    }, 
 
    "s59":{ 
 
    "Vertical":"Center", 
 
    "WrapText":"1", 
 
    "FontName":"Calibri", 
 
    "Family":"Swiss", 
 
    "Size":"11", 
 
    "Color":"#000000", 
 
    "Bold":"1" 
 
    } 
 
}; 
 

 
var name = "styleId" 
 
, option = {}; 
 
option[name] = styles.s57; 
 

 
var styleId = $.extend(styles, option); 
 

 
document.write(styles.styleId.FontName)

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