Code666 (代码贴、代码片段)

[JavaScript] JavaScript对象查看器代码 →→→→→进入此内容的聊天室

来自 , 2020-05-04, 写在 JavaScript, 查看 104 次.
URL http://www.code666.cn/view/26d4b431
  1. // obj: object to inspect
  2. // dest: destination to put the results in.
  3. function inspect(obj, dest) {
  4.        
  5.     // prefent for errors
  6.     if(obj == undefined || dest == undefined)
  7.         return;
  8.    
  9.     if(window.jQuery)
  10.     {
  11.         obj = $(obj).get()[0];
  12.         dest = $(dest).get()[0];
  13.     }
  14.    
  15.     var keys = [],
  16.         values = [];
  17.      
  18.     // functions
  19.     var makeTableRow= function(val1, val2) {
  20.         var tr = document.createElement("tr"),
  21.             tdL = document.createElement("td"),
  22.             tdR = document.createElement("td");
  23.    
  24.          tr.appendChild(tdL);
  25.          tr.appendChild(tdR);
  26.    
  27.          tdL.appendChild(document.createTextNode(val1));
  28.          tdR.appendChild(document.createTextNode(val2));
  29.        
  30.          return tr;
  31.     };
  32.    
  33.     var setBooleanStyle = function(es) {
  34.         es.color = "blue";
  35.     };
  36.  
  37.     var setNumberStyle = function(es) {
  38.         es.color = "darkblue";
  39.         es.fontWeight = "bold";
  40.     };
  41.    
  42.     var setUndefinedStyle = function(es) {
  43.         es.color = "black";
  44.     };
  45.    
  46.     var setFunctionStyle = function(es) {
  47.         es.color = "purple";
  48.     };
  49.    
  50.     var setStringStyle = function(es) {
  51.         es.color = "red";
  52.         es.fontStyle = "italic";
  53.     };
  54.    
  55.     var setObjectStyle = function(es) {
  56.         es.color = "green";
  57.     };
  58.  
  59.     var setDefaultStyle = function(es) {
  60.         //
  61.     };
  62.    
  63.     // filter own properties
  64.     for (var key in obj)
  65.     {
  66.         if(obj.hasOwnProperty(key))
  67.         {
  68.             keys.push(key);  
  69.             values.push(obj[key]);
  70.         }
  71.     }
  72.    
  73.     // render
  74.    
  75.     // table
  76.     var table = document.createElement("table"),
  77.         thead = document.createElement("thead"),
  78.         tbody = document.createElement("tbody");
  79.    
  80.     table.appendChild(thead);
  81.     table.appendChild(tbody);
  82.    
  83.     // header
  84.     thead.appendChild(makeTableRow("Key", "Value"));
  85.    
  86.     // body
  87.     for(var i = 0; i<keys.length; i++)
  88.     {
  89.         var tr = document.createElement("tr"),
  90.             left = document.createElement("td"),
  91.             right = document.createElement("td");
  92.    
  93.         left.appendChild(document.createTextNode(keys[i]));
  94.         right.appendChild(document.createTextNode(values[i]));
  95.    
  96.         tbody.appendChild(tr);
  97.         tr.appendChild(left);
  98.         tr.appendChild(right);
  99.      
  100.         // style
  101.         var ls = left.style;
  102.         ls.color = "gray";
  103.         ls.fontWeight = "bold";
  104.         ls.fontFamily = "Courier New";
  105.         ls.fontSize = "12px";
  106.        
  107.         var rs = right.style;
  108.         rs.fontFamily = "Courier New";
  109.         rs.fontSize = "12px";
  110.        
  111.         switch(typeof values[i])
  112.         {
  113.              case "number":
  114.                  setNumberStyle(rs);
  115.                  break;
  116.                
  117.              case "undefined":
  118.                  setUndefinedStyle(rs);
  119.                  break;
  120.                
  121.              case "boolean":
  122.                  setBooleanStyle(rs);
  123.                  break;
  124.                
  125.              case "object":
  126.                  setObjectStyle(rs);
  127.                  break;
  128.                
  129.              case "string":
  130.                  setStringStyle(rs);
  131.                  break;
  132.                
  133.              case "function":
  134.                  setFunctionStyle(rs);
  135.                  break;
  136.                
  137.              default:
  138.                  setDefaultStyle(rs);
  139.          }
  140.     }
  141.     dest.appendChild(table);
  142. }
  143. //javascript/5393

回复 "JavaScript对象查看器代码"

这儿你可以回复上面这条便签

captcha

贴代码片段 - Code666