Лучший способ, чтобы выполнить итерации через JSON


Так что это мой первый раз, идя за довольно большой вложенный объект, запостил это, чтобы увидеть, как я могу укоротить. (Некоторые страхи у меня будет, я в настоящее время знаю степень вложенности (4), но может быть больше в будущем. Что я не приходится. )

Приведенный ниже код находится внутри функции:

if (itemLi.items) {

var ul = new Element('ul').inject(el)
for (var i = 0; i < itemLi.items.length; i++) {
    var li = new Element('li').inject(ul);
    lastPgNum = itemLi.items[i].page;
    //subItem = new Element('a', {'href': itemLi.items[i].href,'html': itemLi.items[i].title}).inject(li);
    if (itemLi.items[i].items) {

        subItem = new Element('span', {
            'html': itemLi.items[i].title,
            'class': 'pgTitle'
        }).inject(li);
        var ulsub = new Element('ul', {
            'class': 'here1'
        }).inject(ul)

        for (var b = 0; b < itemLi.items[i].items.length; b++) {
            var liSub = new Element('li').inject(ulsub);
            lastPgNum = itemLi.items[i].items[b].page;
            countSubSubs++;

            if (itemLi.items[i].items[b].items) {
                subItem = new Element('span', {
                    'html': itemLi.items[i].items[b].title,
                    'class': 'pgTitle'
                }).inject(liSub);
                var ulsubTwo = new Element('ul', {
                    'class': 'here2'
                }).inject(ulsub)
                for (var c = 0; c < itemLi.items[i].items[b].items.length; c++) {
                    var li = new Element('li').inject(ulsubTwo);
                    lastPgNum = itemLi.items[i].items[b].items[c].page;
                    countSubSubsSub++;
                    subSubItem = new Element('a', {
                        'href': itemLi.items[i].items[b].items[c].href,
                        'html': itemLi.items[i].items[b].items[c].title
                    }).inject(li);
                };
                var startPgSub = new Element('span', {
                    'class': 'pgNumbers',
                    'html': 'pg ' + (lastPgNum - (countSubSubs + countSubSubs + i + 1)) + '-' + lastPgNum
                }).inject(name);
            } else {

                var startPgSub = new Element('span', {
                    'class': 'pgNumbers',
                    'html': 'pg ' + (lastPgNum - (countSubSubs)) + '-' + lastPgNum
                }).inject(name);
                subItem = new Element('a', {
                    'href': itemLi.items[i].items[b].href,
                    'html': itemLi.items[i].items[b].title
                }).inject(liSub);
            }

        };
    } else {

        subItem = new Element('a', {
            'href': itemLi.items[i].href,
            'html': itemLi.items[i].title
        }).inject(li);

        if ((lastPgNum - i) == lastPgNum) {
            startPg = new Element('span', {
                'class': 'pgNumbers',
                'html': 'pg ' + lastPgNum
            }).inject(name);
        } else {
            startPg = new Element('span', {
                'class': 'pgNumbers',
                'html': 'pg ' + (lastPgNum - i) + '-' + lastPgNum
            }).inject(name);
        }

    }
};

};


470
2
задан 27 октября 2011 в 07:10 Источник Поделиться
Комментарии
1 ответ

Вы можете использовать рекурсивную функцию для прохода объекта и генерировать HTML.

Что-то вроде:

function generateList(items, depth) {
if (!depth) depth = 0;
var ul = new Element('ul');
if (depth) { ul.addClass('here' + depth); }
for (var i = 0; i < items.length; ++i)
{
var item = items[i];
var li = new Element('li').inject(ul);
if (item.items) {
li.adopt(new Element('span', {
'html' : item.title,
'class': 'pgTitle'
}));
li.adopt(generateList(item.items, depth + 1));
} else {
li.adopt(new Element('a', {
'href' : item.href,
'title': item.title
}));
}
}
return ul;
}

if (itemLi.items) {
generateList(itemLi.items).inject(el);
}

Это не включает в себя код, чтобы добавить перегонах страницы, потому что я пока не понимаю, как они должны быть созданы. (Код не включает объявления переменных, для затравки.) Но это должно создать список ссылок, с подсписки на любые предметы, которые имеют подпункты. Занятия для подсписков немного ненужным, CSS позволяет выбрать их как по ul>батарея Li>Ул и ул>батарея Li>ул>батарея Li>ул ... так что если у вас есть другие должны отслеживать количество вложенности, вы могли избавиться от глубокого и класса по улС.

1
ответ дан 28 октября 2011 в 12:10 Источник Поделиться