zoukankan      html  css  js  c++  java
  • 页面格式化后台的传过来的

    最终效果如图

    <nodes>
        <nodesensor>
            <nsid>0868334030095685JG02</nsid>
            <nodeid>0868334030095685</nodeid>
            <apid>123456789</apid>
            <sensortype>JG02</sensortype>
            <sdvalue>66</sdvalue>
            <unit>
            </unit>
            <update>2018-12-13 11:03:19</update>
            <longitude>
            </longitude>
            <latitude>
            </latitude>
        </nodesensor>
        <nodesensor>
            <nsid>0868334030095685JG01</nsid>
            <nodeid>0868334030095685</nodeid>
            <apid>123456789</apid>
            <sensortype>JG01</sensortype>
            <sdvalue>3.55</sdvalue>
            <unit>V</unit>
            <update>2018-12-13 11:03:19</update>
            <longitude>
            </longitude>
            <latitude>
            </latitude>
        </nodesensor>
        <nodesensor>
            <nsid>0868334030095685JG03</nsid>
            <nodeid>0868334030095685</nodeid>
            <apid>123456789</apid>
            <sensortype>JG03</sensortype>
            <sdvalue>-15</sdvalue>
            <unit>
            </unit>
            <update>2018-12-13 11:03:19</update>
            <longitude>
            </longitude>
            <latitude>
            </latitude>
        </nodesensor>
        <nodesensor>
            <nsid>086833403009568501</nsid>
            <nodeid>0868334030095685</nodeid>
            <apid>123456789</apid>
            <sensortype>01</sensortype>
            <sdvalue>0460042178905468</sdvalue>
            <unit>
            </unit>
            <update>2018-12-13 11:03:19</update>
            <longitude>
            </longitude>
            <latitude>
            </latitude>
        </nodesensor>
    </nodes>

    网上的示例有些可以用,有些不可以用,但可用的也都是不显示的xml标签的,
    因为没有对标签转义,所以显示不出来,另外还需要放在pre预格式化标签里,才能整齐的显示xml

    <!--格式化后的xml写入的位置-->
    <div id="writePlace"></div>
    <script>
        //格式化代码函数,已经用原生方式写好了不需要改动,直接引用就好
        String.prototype.removeLineEnd = function () {
            return this.replace(/(<.+?s+?)(?: s*?(.+?=".*?"))/g, '$1 $2')
        }
        function formatXml(text) {
            //去掉多余的空格
            text = ' ' + text.replace(/(<w+)(s.*?>)/g, function ($0, name, props) {
                        return name + ' ' + props.replace(/s+(w+=)/g, " $1");
                    }).replace(/>s*?</g, "> <");
                    

            //把注释编码
            text = text.replace(/ /g, ' ').replace(/<!--(.+?)-->/g, function ($0, text) {
                var ret = '<!--' + escape(text) + '-->';
                //alert(ret);
                return ret;
            }).replace(/ /g, ' ');

            //调整格式
            var rgx = / (<(([^?]).+?)(?:s|s*?>|s*?(/)>)(?:.*?(?:(?:(/)>)|(?:<(/)2>)))?)/mg;
            var nodeStack = [];
            var output = text.replace(rgx, function ($0, all, name, isBegin, isCloseFull1, isCloseFull2, isFull1, isFull2) {
                var isClosed = (isCloseFull1 == '/') || (isCloseFull2 == '/' ) || (isFull1 == '/') || (isFull2 == '/');
                //alert([all,isClosed].join('='));
                var prefix = '';
                if (isBegin == '!') {
                    prefix = getPrefix(nodeStack.length);
                }
                else {
                    if (isBegin != '/') {
                        prefix = getPrefix(nodeStack.length);
                        if (!isClosed) {
                            nodeStack.push(name);
                        }
                    }
                    else {
                        nodeStack.pop();
                        prefix = getPrefix(nodeStack.length);
                    }

                }
                var ret = ' ' + prefix + all;
                return ret;
            });

            var prefixSpace = -1;
            var outputText = output.substring(1);
            //alert(outputText);

            //把注释还原并解码,调格式
            outputText = outputText.replace(/ /g, ' ').replace(/(s*)<!--(.+?)-->/g, function ($0, prefix, text) {
                //alert(['[',prefix,']=',prefix.length].join(''));
                if (prefix.charAt(0) == ' ')
                    prefix = prefix.substring(1);
                text = unescape(text).replace(/ /g, ' ');
                var ret = ' ' + prefix + '<!--' + text.replace(/^s*/mg, prefix) + '-->';
                //alert(ret);
                return ret;
            });
    //alert(outputText);
            return outputText;
        }
        function getPrefix(prefixIndex) {
            var span = '    ';
            var output = [];
            for (var i = 0; i < prefixIndex; ++i) {
                output.push(span);
            }

            return output.join('');
        }

        //引用示例部分
        //(1)创建xml格式或者从后台拿到对应的xml格式
        var originalXml = '<nodes><nodesensor><nsid>0868334030095685JG02</nsid><nodeid>0868334030095685</nodeid><apid>123456789</apid><sensortype>JG02</sensortype><sdvalue>66</sdvalue><unit></unit><update>2018-12-13 11:03:19</update><longitude></longitude><latitude></latitude></nodesensor><nodesensor><nsid>0868334030095685JG01</nsid><nodeid>0868334030095685</nodeid><apid>123456789</apid><sensortype>JG01</sensortype><sdvalue>3.55</sdvalue><unit>V</unit><update>2018-12-13 11:03:19</update><longitude></longitude><latitude></latitude></nodesensor><nodesensor><nsid>0868334030095685JG03</nsid><nodeid>0868334030095685</nodeid><apid>123456789</apid><sensortype>JG03</sensortype><sdvalue>-15</sdvalue><unit></unit><update>2018-12-13 11:03:19</update><longitude></longitude><latitude></latitude></nodesensor><nodesensor><nsid>086833403009568501</nsid><nodeid>0868334030095685</nodeid><apid>123456789</apid><sensortype>01</sensortype><sdvalue>0460042178905468</sdvalue><unit></unit><update>2018-12-13 11:03:19</update><longitude></longitude><latitude></latitude></nodesensor></nodes>';
        //(2)调用formatXml函数,将xml格式进行格式化
        var resultXml = formatXml(originalXml);
        //alert(resultXml)
        for (var i = 0; i < resultXml.length; i++) {
            resultXml=resultXml.replace('<', '&lt;').replace('>', '&gt;');
        }
        //(3)将格式化好后的formatXml写入页面中
        //$("#writePlace").html(resultXml.replace('<', '&lt;').replace('>', '&gt;'));
        document.getElementById("writePlace").innerHTML = '<pre>' +resultXml + '<pre/>';
    </script>

  • 相关阅读:
    Java实现 LeetCode 416 分割等和子集
    Java实现 LeetCode 416 分割等和子集
    在Linux运行期间升级Linux系统(Uboot+kernel+Rootfs)
    【详解】嵌入式开发中固件的烧录方式
    嵌入式系统烧写uboot/bootloader/kernel的一般方法
    Linux下USB烧写uImage kernel
    Xmanager连接CentOS的远程桌面
    命令行利器Tmux
    u-boot中分区和内核MTD分区关系
    uboot环境变量与内核MTD分区关系
  • 原文地址:https://www.cnblogs.com/bjjjunjie/p/10114454.html
Copyright © 2011-2022 走看看