{"id":1772,"date":"2023-02-17T10:56:49","date_gmt":"2023-02-17T10:56:49","guid":{"rendered":"https:\/\/www.tools.keywordfinder.us\/?page_id=1772"},"modified":"2023-02-17T10:56:49","modified_gmt":"2023-02-17T10:56:49","slug":"xml-viewer","status":"publish","type":"page","link":"https:\/\/tools.billionsideas.com\/de\/xml-viewer\/","title":{"rendered":"XML Viewer"},"content":{"rendered":"<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-9d6595d7 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column has-base-3-background-color has-background is-layout-flow wp-block-column-is-layout-flow\">\n<section><h1>XML Viewer\n<\/h1><br>\n  \n  <form action=\"\">\n    <label for=\"xml-input\"><b><b>Enter XML Below<\/b><\/b><\/label>\n    <br>\n    <textarea id=\"xml-input\" rows=\"10\" cols=\"50\"><\/textarea>\n    <br>\n    <button type=\"button\" onclick=\"displayXML()\">View XML<\/button>\n    <br><br>\n    <label for=\"file-upload\">Or upload a file:<\/label>\n    <br>\n    <input type=\"file\" id=\"file-upload\" accept=\".xml, .html\">\n    <button type=\"button\" onclick=\"uploadFile()\">Upload<\/button>\n  <input type=\"hidden\" name=\"trp-form-language\" value=\"de\"\/><\/form>\n  <br>\n  <div id=\"xml-output\"><\/div>  <br>\n  <br>\n<\/section>\n  <script>\n    function displayXML() {\n      \/\/ Get the XML input\n      var xmlInput = document.getElementById(\"xml-input\").value;\n      \n      \/\/ Parse the XML and format it for display\n      var parser = new DOMParser();\n      var xmlDoc = parser.parseFromString(xmlInput, \"text\/xml\");\n      var formattedXML = formatXML(xmlDoc);\n      \n      \/\/ Display the formatted XML\n      document.getElementById(\"xml-output\").innerHTML = formattedXML;\n    }\n    function uploadFile() {\n      \/\/ Get the file input\n      var fileInput = document.getElementById(\"file-upload\").files[0];\n\n      \/\/ Create a new FileReader\n      var reader = new FileReader();\n\n      \/\/ Set the onload function\n      reader.onload = function() {\n        var xmlInput = reader.result;\n\n        \/\/ Parse the XML and format it for display\n        var parser = new DOMParser();\n        var xmlDoc = parser.parseFromString(xmlInput, \"text\/xml\");\n        var formattedXML = formatXML(xmlDoc);\n\n        \/\/ Display the formatted XML\n        document.getElementById(\"xml-output\").innerHTML = formattedXML;\n      };\n\n      \/\/ Read the file as text\n      reader.readAsText(fileInput);\n    }\n    \n    function formatXML(xml) {\n      \/\/ Initialize the formatted XML string\n      var formattedXML = \"\";\n      \n      \/\/ Recursively format the XML node and its children\n      function formatNode(node) {\n        \/\/ Add the opening tag\n        formattedXML += \"<span class='tag'>\" + node.tagName + \"<\/span>\";\n        \n        \/\/ Add the attributes\n        var attrs = node.attributes;\n        for (var i = 0; i < attrs.length;i++) {\nformattedXML += \" <span class='attr'>\" + attrs[i].name + \"<\/span>=\" +\n\"<span class='attr-value'>\" + attrs[i].value + \"<\/span>\";\n}\n            \/\/ Add the children\n    var children = node.childNodes;\n    for (var i = 0; i < children.length; i++) {\n      if (children[i].nodeType === 1) { \/\/ element node\n        formattedXML += \"<br>\";\n        formatNode(children[i]);\n      } else if (children[i].nodeType === 3) { \/\/ text node\n        formattedXML += children[i].nodeValue;\n      }\n    }\n    \n    \/\/ Add the closing tag\n    formattedXML += \"<span class='tag'>&lt;\" + \"\/\" + node.tagName + \"&gt;<\/span><br>\";\n  }\n  \n  formatNode(xml.documentElement);\n  return formattedXML;\n}\n <\/script>\n<style>\n       section{\n         margin-top:60px;\n        width: 100%;\n        max-width: 970px;\n        background-color: #fff;\n        border: 1px solid #ddd;\n        padding: 25px;\n      }\n#xml-output{width:100%;height:100%;background:#F7F8F9;padding:11px}\n<\/style>\n<\/div>\n<\/div>","protected":false},"excerpt":{"rendered":"<p>XML Viewer Enter XML Below View XML Or upload a file: Upload<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_kad_blocks_custom_css":"","_kad_blocks_head_custom_js":"","_kad_blocks_body_custom_js":"","_kad_blocks_footer_custom_js":"","footnotes":""},"class_list":["post-1772","page","type-page","status-publish"],"taxonomy_info":[],"featured_image_src_large":false,"author_info":{"display_name":"Billions Ideas","author_link":"https:\/\/tools.billionsideas.com\/de\/author\/loginbillionsideas-com\/"},"comment_info":0,"jetpack-related-posts":[],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/tools.billionsideas.com\/de\/wp-json\/wp\/v2\/pages\/1772","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tools.billionsideas.com\/de\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/tools.billionsideas.com\/de\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/tools.billionsideas.com\/de\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/tools.billionsideas.com\/de\/wp-json\/wp\/v2\/comments?post=1772"}],"version-history":[{"count":0,"href":"https:\/\/tools.billionsideas.com\/de\/wp-json\/wp\/v2\/pages\/1772\/revisions"}],"wp:attachment":[{"href":"https:\/\/tools.billionsideas.com\/de\/wp-json\/wp\/v2\/media?parent=1772"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}