@jokerwang/json-format/dist/json-format.min.js

json to stringify a dom structure Object

!function(t,e){if("object"==typeof exports&&"object"==typeof module)module.exports=e();else if("function"==typeof define&&define.amd)define([],e);else{var n=e();for(var i in n)("object"==typeof exports?exports:t)[i]=n[i]}}(window,function(){return function(t){var e={};function n(i){if(e[i])return e[i].exports;var r=e[i]={i:i,l:!1,exports:{}};return t[i].call(r.exports,r,r.exports,n),r.l=!0,r.exports}return n.m=t,n.c=e,n.d=function(t,e,i){n.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:i})},n.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},n.t=function(t,e){if(1&e&&(t=n(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var i=Object.create(null);if(n.r(i),Object.defineProperty(i,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var r in t)n.d(i,r,function(e){return t[e]}.bind(null,r));return i},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="",n(n.s=0)}([function(t,e,n){"use strict";function i(t){if(!this instanceof i)return new i(t);this.structure="structure-",this.closeIcon='<svg t="1564458467154" class="icon" viewBox="0 -200 1024 1224" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5087" width="16" height="16"><path d="M904 64c30.9 0 56 25.1 56 56v784c0 30.9-25.1 56-56 56H120c-30.9 0-56-25.1-56-56V120c0-30.9 25.1-56 56-56h784m0-64H120C53.7 0 0 53.7 0 120v784c0 66.3 53.7 120 120 120h784c66.3 0 120-53.7 120-120V120c0-66.3-53.7-120-120-120z" fill="#1296db" p-id="5088"></path><path d="M736 480H288c-17.7 0-32 14.3-32 32s14.3 32 32 32h448c17.7 0 32-14.3 32-32s-14.3-32-32-32z" fill="#1296db" p-id="5089"></path></svg>',this.openIcon='<svg t="1564457800369" class="icon" viewBox="0 -200 1024 1224" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5092" width="16" height="16"><path d="M915.746268 0h-807.911811C48.273134 0 0 48.482772 0 107.834457v807.911811c0 59.561323 48.482772 107.834457 107.834457 107.834456h807.911811c59.561323 0 107.834457-48.482772 107.834456-107.834456v-807.911811c0-59.343622-48.482772-107.834457-107.834456-107.834457z m56.634456 915.746268c0 31.139276-25.495181 56.634457-56.634456 56.634456h-807.911811c-31.139276 0-56.634457-25.495181-56.634457-56.634456v-807.911811c0-31.139276 25.495181-56.634457 56.634457-56.634457h807.911811c31.139276 0 56.634457 25.495181 56.634456 56.634457v807.911811z m-267.288189-429.451087H537.293606V318.488189a25.688693 25.688693 0 0 0-25.704819-25.704819A25.688693 25.688693 0 0 0 485.875906 318.488189v167.806992H318.068913c-14.215055 0-25.704819 11.497827-25.704819 25.495181a25.688693 25.688693 0 0 0 25.704819 25.704819H485.875906v167.806992a25.688693 25.688693 0 0 0 25.704818 25.704819 25.688693 25.688693 0 0 0 25.704819-25.704819V537.495181H705.108661a25.688693 25.688693 0 0 0 25.704819-25.704819c0-14.206992-11.497827-25.495181-25.704819-25.495181z" fill="#1296db" p-id="5093"></path></svg>',this.dom=t,this.clear(),this.fragment=document.createDocumentFragment(),this.box=document.createElement("div"),this.dom.appendChild(this.box),this.listenExpand()}n.r(e),i.prototype.listenExpand=function(){const t=this.openIcon,e=this.closeIcon;this.box.addEventListener("click",function(n){const i=n.target.nodeName.toLowerCase();if("svg"===i||"i"===i||"path"===i){const r="svg"===i?n.target.parentNode:"path"===i?n.target.parentNode.parentNode:n.target,s=r.parentNode,o=s.className;let a=document.createElement("div"),p=[];s&&s.nextSibling&&"hidden"==s.nextSibling.className?function(t){let n=s.nextSibling;n&&(n.outerHTML=n.innerHTML,r.innerHTML=e)}():function e(n){let i=n.nextSibling;if(i)if(i.className==o){let e=document.createDocumentFragment(),n=0;for(;n<p.length;)e.appendChild(p[n]),n++;a.style.cssText="display:none;!important",a.className="hidden",a.appendChild(e),s.parentNode.insertBefore(a,i),r.innerHTML=t}else p.push(i),e(i)}(s)}},!1)},i.prototype.getTag=function(t){return null==t?void 0===t?"[object Undefined]":"[object Null]":Object.prototype.toString.call(t)},i.prototype.isObject=function(t){return"[object Object]"===this.getTag(t)},i.prototype.isArray=function(t){return"[object Array]"===this.getTag(t)},i.prototype.appendToFragment=function(t,e,n,i,r){let s=document.createElement(t);if(s.innerHTML=e,r){let t=document.createElement("i");t.innerHTML=r,t.style.cssText="cursor:pointer;font-style:normal;",s.appendChild(t)}if(i&&(s.className=i),this.fragment.appendChild(s),n)return;let o=document.createElement("br");this.fragment.appendChild(o)},i.prototype.getKeyValueStr=function(t,e,n,i){let r="";for(let t=0;t<n;t++)r+=i;return r+='"'+t+'":',"[object String]"===this.getTag(e)?r+='"'+e+'"':r+=e,r},i.prototype.getKeyStr=function(t,e,n){let i="";for(let t=0;t<e;t++)i+=n;return i+='"'+t+'":'},i.prototype.getValue=function(t,e,n){let i="";for(let t=0;t<e;t++)i+=n;return"[object String]"===this.getTag(t)?i+='"'+t+'"':i+=t,i},i.prototype.getSign=function(t,e,n){let i="";for(let t=0;t<e;t++)i+=n;return i+=t},i.prototype.format=function(t){const e="&nbsp;&nbsp;";let n=0;let i=0,r=(t,s,o)=>{if(this.isArray(t)){0==t.length&&("object-next-array"===s?o?this.appendToFragment("span","[]",!1,""):this.appendToFragment("span","[],",!1,""):"array-sibling-dot"===s?(this.appendToFragment("span",this.getSign("",n-2,e),!0,""),this.appendToFragment("span","[],",!1,"")):(this.appendToFragment("span",this.getSign("",n-2,e),!0,""),this.appendToFragment("span","[]",!1,"")),n-=2);for(let o=0;o<t.length;o++){const a=t[o];if(0==o&&(i++,"object-next-array"===s?this.appendToFragment("span","[",!1,this.structure+i,this.closeIcon):(this.appendToFragment("span",this.getSign("",n-2,e),!0,""),this.appendToFragment("span","[",!1,this.structure+i,this.closeIcon))),"first-array"===s&&0==o&&(n+=2),this.isArray(a))n+=2,o<t.length-1?r(a,"array-sibling-dot"):r(a);else if(this.isObject(a))n+=2,r(a,"array-next-object");else{let i=this.getValue(a,n,e);o<t.length-1&&(i+=","),this.appendToFragment("span",i,!1)}o==t.length-1&&(n-=2,this.appendToFragment("span",this.getSign("",n,e),!0,""),"array-sibling-dot"===s?(this.appendToFragment("span","]",!0,this.structure+i),this.appendToFragment("span",",",!1,"")):this.appendToFragment("span","]",!1,this.structure+i),i--)}}else if(this.isObject(t)){const o=Object.keys(t);0===o.length&&("object-sibling-dot"===s?this.appendToFragment("span","{},",!1,""):"array-next-object"===s?(this.appendToFragment("span",this.getSign("{},",n-2,e),!1,""),n-=2):this.appendToFragment("span","{}",!1,""));for(let a=0;a<o.length;a++){const p=o[a],c=t[p];if(0==a&&(i++,"array-next-object"===s?(this.appendToFragment("span",this.getSign("",n-2,e),!0,""),this.appendToFragment("span","{",!1,this.structure+i,this.closeIcon)):(this.appendToFragment("span","",!0,""),this.appendToFragment("span","{",!1,this.structure+i,this.closeIcon))),"first-object"===s&&0===a&&(n+=2),this.isObject(c)){let t=this.getKeyStr(p,n,e);this.appendToFragment("span",t,!0),Object.keys(c).length&&(n+=2),a<o.length-1?r(c,"object-sibling-dot"):r(c)}else if(this.isArray(c)){let t=this.getKeyStr(p,n,e);this.appendToFragment("span",t,!0),n+=2,a===o.length-1?r(c,"object-next-array",!0):r(c,"object-next-array")}else{let t=this.getKeyValueStr(p,c,n,e);a<o.length-1&&(t+=","),this.appendToFragment("span",t,!1)}a==o.length-1&&(n-=2,"object-sibling-dot"===s?(this.appendToFragment("span",this.getSign("",n,e),!0,""),this.appendToFragment("span","}",!0,this.structure+i),this.appendToFragment("span",",",!1,"")):(this.appendToFragment("span",this.getSign("",n,e),!0,""),this.appendToFragment("span","}",!1,this.structure+i)),i--)}}};this.isArray(t)?r.call(this,t,"first-array"):this.isObject(t)?r.call(this,t,"first-object"):r.call(this,t),this.box.appendChild(this.fragment)},i.prototype.clear=function(){this.dom.innerHTML=""},window&&(window.JSONFormatter=i),e.default=i}])});