Javascript/jQuery关于JSON或数组集合的几种循环方法

JavaScript遍历JSON或数组集合:

/**
 * 根据json数据生成option树形控件
 * 如果有children节点则自动生成树形数据
 * @param {JSON} data
 * @param {int} n 节点深度
 * @param {string} char 节点名称前缀
 * @returns {string}
 * @since 1.0 2014-8-22 by sutroon
 * @example
 *      var data = (typeof (data) == "object") ? data : $.parseJSON(data);
 *      var str = '';
 *      str=generate_options(data);
 */
function generate_options(data, n, char) {
    if (n == undefined) {
        n = 0;
    }
    if (char == undefined) {
        char = '..';
    }
    var pad = '';
    while (n > 0) {
        pad += char;
        n--;
    }
    var str = '';
    if (data.length) {
        // 多行格式
        for (var i = 0; i < data.length; i++) {
            if (data[i].id) {
                // 用于[{"id":"1","name":"name1"}]格式                
                str += '<option value="' + data[i].id + '">' + pad + (data[i].name ? data[i].name : data[i].text) + '</option>';
            } else if (data[i].item) {
                // 用于[{"item":"1"},{"item":"2"}]
                str += '<option value="' + data[i].item + '">' + pad + data[i].item + '</option>';
            } else {
                // 用于["item1","item2"]格式
                str += '<option value="' + data[i] + '">' + pad + data[i] + '</option>';
            }
            if (data[i].children) {
                str += generate_options(data[i].children, n + 1, char);
            }
        }
    }
    else {
        // 用于{"a":"a1","b":"b2"}单行格式
        for (var attr in data) {
            str += '<option value="' + attr + '">' + data[attr] + '</option>';
        }
    }
    return str;
}

jQuery遍历JSON集合:

/**
 * Jquery遍历JSON集合
 * @param JSON或Array data
 * @param integer n
 * @param string char
 * @returns string
 * @since 1.0 <2015-6-11> SoChishun Added.
 * @example 
 alert(generate_options([{"id": "1", "name": "name1"}]));
 alert(generate_options([{"item": "1"}, {"item": "2"}]));
 alert(generate_options(["item1", "item2"]));
 alert(generate_options({"a": "a1", "b": "b2"}));
 */
function generate_options(data, n, char) {
    if (n == undefined) {
        n = 0;
    }
    if (char == undefined) {
        char = '..';
    }
    var pad = '';
    while (n > 0) {
        pad += char;
        n--;
    }
    var str = '';
    if ($.isArray(data)) {
        // 多行格式
        $.each(data, function () {
            if (this.id) {
                // 用于[{"id":"1","name":"name1"}]格式                
                str += '<option value="' + this.id + '">' + pad + (this.name ? this.name : this.text) + '</option>';
            } else if (this.item) {
                // 用于[{"item":"1"},{"item":"2"}]
                str += '<option value="' + this.item + '">' + pad + this.item + '</option>';
            } else {
                // 用于["item1","item2"]格式
                str += '<option value="' + this + '">' + pad + this + '</option>';
            }
            if (this.children) {
                str += generate_options(this.children, n + 1, char);
            }
        })
    }
    else {
        if ($.isPlainObject(data)) {
            // 用于{"a":"a1","b":"b2"}单行格式
            $.each(data, function (key) {
                str += '<option value="' + key + '">' + this + '</option>';
            })
        }
    }
    return str;
}

 

版权声明:本文采用署名-非商业性使用-相同方式共享(CC BY-NC-SA 3.0 CN)国际许可协议进行许可,转载请注明作者及出处。
本文标题:Javascript/jQuery关于JSON或数组集合的几种循环方法
本文链接:http://www.cnblogs.com/sochishun/p/7263562.html
本文作者:SoChishun (邮箱:14507247#qq.com | 博客:http://www.cnblogs.com/sochishun/)
发表日期:2017年7月31日

posted on 2017-07-31 16:05  sochishun  阅读(980)  评论(0编辑  收藏  举报