Javascript 对象值显示工具-OKViewer

/*
copyright @2012- okcoder
http://okcoder.cnblogs.com/
*/
OKViewer = function () {
    this.maxLevel = 2;
}
OKViewer.prototype = {
    show: function (o) {
        try {
            var viewerWin = window.open("about:blank", "aaa");
            viewerWin.document.write("");
        } catch (e) {
            if (e.number == -2147024891 && viewerWin != null && !viewerWin.closed) {
                viewerWin.close();
                viewerWin = window.open("about:blank", "aaa");
            }
        }
        var div = this._getHtml(o);
        viewerWin.document.write("<html><head><script>var showHidden=" + this._showHidden + "</script><style type=\"text/css\">table{border:none;border-bottom:0.5px solid #ffcc00;border-left:0.5px solid #ffcc00;border-spacing: 0px;}td{border:0.5px solid #ffcc00;border-bottom:none;border-left:none;vertical-align:top;}</style></head><body>" + div.innerHTML + "</body></html>");
        viewerWin.$v = new OKViewer();
        div = null;
    },
    _getHtml: function (o, level) {
        if (level == null) level = 1;
        var table = document.createElement("table");
        table.attributes["cellpadding"] = 0;
        table.attributes["cellspacing"] = 0;
        this._addRow(table, "type", typeof (o), null);
        this._addRow(table, "constructor", o.constructor, null);
        for (key in o) {
            this._addRow(table, key, o[key], level);
        }
        var div = document.createElement("div");
        div.appendChild(table);
        table = null;
        return div;
    },
    _addRow: function (table, key, value, level) {
        var row = table.insertRow(-1);
        var cell = row.insertCell(-1);
        cell.innerHTML = key;
        cell = row.insertCell(-1);
        cell.innerHTML = typeof (value);
        cell = row.insertCell(-1);
        cell.innerHTML = this._getValueHtml(key, value, level);
        row = null;
        cell = null;
    },
    _getValueHtml: function (key, value, level) {
        try {
            if (value == null || value == "") {
                return "<b>NULL</b>";
            }

            var valueType = typeof (value);
            if (valueType == "function") {
                return "<div style='height:60px;width=400px;overflow:scroll'><pre>" + value + "</pre></div>";
            }
            if (valueType == "object" && level <= this.maxLevel && key.indexOf("parent") == -1 && !this._isElement(value)) {
                var subDiv = this._getHtml(value, level + 1);
                subDiv.children[0].style.display = "none";
                return "<div onclick='showHidden(this)'>+</div>" + subDiv.innerHTML;
            }
            return "<pre>" + value + "</pre>";
        }
        catch (e) {
            return "<pre><b>ERROR:</b>" + e.name+e.number+e.message+ "</pre>";
        }
    },
    _showHidden: function (div) {
        var cell = div.parentElement;
        var subTable = cell.children[1];
        if (div.innerHTML == "+") {
            subTable.style.display = "";
            div.innerHTML = "-";
        } else {
            subTable.style.display = "none";
            div.innerHTML = "+";
        }
    },
    _isElement : function(o){ 
      return ( 
        typeof HTMLElement === "object" ? o instanceof HTMLElement : //DOM2 
        o && typeof o === "object" && o.nodeType === 1 && typeof o.nodeName==="string" 
    ); 
    }
};
window.$v = new OKViewer();

  

转载于:https://www.cnblogs.com/okcoder/archive/2012/03/27/2418906.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值