zoukankan html css js c++ java

自動化ツール（コード生成、パターン抽出）

コード生成：

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
    <script src="https://code.jquery.com/jquery-3.2.1.min.js"
            integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
            crossorigin="anonymous"></script>
    <script>

        function _exeInputValue() {
            var inputText = $("#inputText").val();
            var inputLines = inputText.split("
");
            var inputGridValues = [];
            for (var i = 0 ; i < inputLines.length; i++) {
                var line = inputLines[i];
                if (line.length > 0) {
                    var values = line.split("	");
                    var lineValues = [];

                    for (var j = 0 ; j < values.length ; j++) {
                        lineValues.push(values[j]);
                    }

                    inputGridValues.push(lineValues);
                }
            }

            return inputGridValues;
        }

        function _exeInputView(inputGridValues)
        {
            var table = $("<table class='outputViewTable'>");
            for (var i = 0 ; i < inputGridValues.length ; i++) {
                var lineValues = inputGridValues[i];

                if (i == 0) {
                    var tr = $("<tr class='w3-green'>");
                    for (var j = 0 ; j < lineValues.length; j++) {
                        var value = lineValues[j];

                        var td = $("<td class='w3-border-white'>");
                        td.html('{' + j + '}');

                        tr.append(td);
                    }
                    table.append(tr);
                }

                var tr = $("<tr>");
                for (var j = 0 ; j < lineValues.length; j++) {
                    var value = lineValues[j];

                    var td = $("<td>");
                    td.html(value);

                    tr.append(td);
                }
                table.append(tr);
            }

            $("#inputView").empty().append(table);
        }

        function _exeOutputCode(inputGridValues) {
            var template = $("#inputTemplate").val();

            var outputText = [];

            for (var i = 0 ; i < inputGridValues.length; i++) {
                var lineValues = inputGridValues[i];

                var text = template;
                for (var j = 0 ; j < lineValues.length; j++) {
                    var value = lineValues[j];
                    text = text.replace("{" + j + "}", value);
                }

                outputText.push(text);
            }

            $("#outputText").val(outputText.join("
"));
        }

        function codeOutput() {
            
            var inputGridValues = _exeInputValue();

            _exeInputView(inputGridValues);

            _exeOutputCode(inputGridValues);
        }
    </script>
    <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
    <style>
        *{
            box-sizing:border-box;
        }
        body{
            overflow:hidden;
        }
        table{
            border-collapse:collapse;
        }
        .absoluteBase {
            position: absolute;
            top: 0px;
            bottom: 0;
            left: 0;
            right: 0;
        }
        div {
            /*border: 1px solid green;*/
        }
        .leftTop {
            bottom: 50%;
            right: 50%;
        }
        .rightTop {
            bottom: 50%;
            left: 50%;
        }
        .bottom {
            top: 50%;
        }
        .relativeRoot {
            position: relative;
            height: 100%;
             100%;
        }
        .title {
            padding: 8px;
            font-size: 20px;
            font-family: "Segoe UI",Arial,sans-serif;
        }
        #inputView,#outputView{
            padding:5px;
            overflow:scroll;
        }
        textarea{
            border:none;
        }
        button{
            height:35px;
        }
        .outputViewTable td {
            border: 1px solid #4CAF50;
            padding: 5px 8px;
        }
    </style>
</head>
<body>
    <div style="height:35px;">
        <button onclick="codeOutput();">コード生成</button>
    </div>
    <div style="position:absolute;top:35px;bottom:2px;left:0;right:0;border:1px solid black;">
        <div class="relativeRoot">
            <div class="absoluteBase leftTop w3-border">
                <div class="relativeRoot">
                    <div class="absoluteBase" style="bottom:50%">
                        <div class="title w3-teal" style="height:50px;">
                            入力値
                        </div>
                        <div class="absoluteBase" style="top:50px">
                            <textarea id="inputText" style="100%;height:100%">a1	b1	c1
a2	b2	c2
a3	b3	c3</textarea>
                        </div>
                    </div>
                    <div class="absoluteBase" style="top:50%;">
                        <div class="title w3-teal" style="height:50px;">
                            入力テンプレート
                        </div>
                        <div class="absoluteBase" style="top:50px">
                            <textarea id="inputTemplate" style="100%;height:100%">//{0}
public string {1}; //{2}
</textarea>
                        </div>
                    </div>
                </div>
            </div>
            <div class="absoluteBase rightTop w3-border">
                <div class="relativeRoot">
                    <div class="title w3-teal" style="height:50px;">
                        入力値可視化
                    </div>
                    <div id="inputView" class="absoluteBase" style="top:50px">
                        
                    </div>
                </div>
            </div>
            <div class="absoluteBase bottom w3-border" >
                <div class="relativeRoot">
                    <div class="title w3-teal" style="height:50px;">
                        出力テキスト
                    </div>
                    <div class="absoluteBase" style="top:50px">
                        <textarea id="outputText" style="100%;height:100%"></textarea>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>
</html>

　　パターン抽出：

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
    <script src="https://code.jquery.com/jquery-3.2.1.min.js"
            integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
            crossorigin="anonymous"></script>
    <script>

        function _exeOutputView(arr)
        {
            var table = $("<table class='outputViewTable'>");
            for (var i = 0 ; i < arr.length ; i++) {
                var lineValues = arr[i];

                if (i == 0) {
                    var tr = $("<tr class='w3-green'>");
                    for (var j = 0 ; j < lineValues.length; j++) {
                        var value = lineValues[j];

                        var td = $("<td class='w3-border-white'>");
                        td.html('{' + j + '}');

                        tr.append(td);
                    }
                    table.append(tr);
                }

                var tr = $("<tr>");
                for (var j = 0 ; j < lineValues.length; j++) {
                    var value = lineValues[j];

                    var td = $("<td>");
                    td.html(value);

                    tr.append(td);
                }
                table.append(tr);
            }

            $("#outputView").empty().append(table);
        }

        function _exeOutputCode(arr) {

            var outputText = [];

            for (var i = 0 ; i < arr.length; i++) {
                var lineValues = arr[i];

                var text = "";
                for (var j = 0 ; j < lineValues.length; j++) {
                    var value = lineValues[j];
                    if (j != 0) {
                        text += '	';
                    }
                    text += value;
                }

                outputText.push(text);
            }

            $("#outputText").val(outputText.join("
"));
        }

        function codeOutput(matchFromFirst) {
            
            var resultArray = [];

            var text = $("#inputText").val();

            var regexText = $("#inputRegex").val();

            var regex = new RegExp(regexText, "g");

            if (!text || !regexText) {
                return;
            }

            var result = regex.exec(text);
            while (result) {
                var arr = [];
                var i = 0;
                if (matchFromFirst == false) {
                    i = 1;
                }
                for ( ; i < result.length ; i++) {
                    arr.push(result[i]);
                }
                resultArray.push(arr);
                result = regex.exec(text);
            }
            //var mm = regex.exec(text);
            //var m = text.match(regex);

            _exeOutputCode(resultArray);
            _exeOutputView(resultArray);
        }
    </script>
    <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
    <style>
        *{
            box-sizing:border-box;
        }
        table{
            border-collapse:collapse;
        }
        .absoluteBase {
            position: absolute;
            top: 0px;
            bottom: 0;
            left: 0;
            right: 0;
        }
        div {
            /*border: 1px solid green;*/
        }
        .leftTop {
            bottom: 50%;
            right: 50%;
        }
        .rightTop {
            bottom: 50%;
            left: 50%;
        }
        .leftBottom {
            top: 50%;
            right: 50%;
        }
        .rightBottom {
            top: 50%;
            left: 50%;
        }
        .relativeRoot {
            position: relative;
            height: 100%;
             100%;
        }
        .title {
            padding: 8px;
            font-size: 20px;
            font-family: "Segoe UI",Arial,sans-serif;
        }
        #inputView,#outputView{
            padding:5px;
            overflow:scroll;
        }
        textarea{
            border:none;
        }
        button{
            height:35px;
        }
        .outputViewTable td {
            border: 1px solid #4CAF50;
            padding: 5px 8px;
        }
    </style>
</head>
<body>
    <div style="height:35px;">
        <button onclick="codeOutput(true);">パターン抽出(0含む)</button>
        <button onclick="codeOutput(false);">パターン抽出(0含まない)</button>
    </div>
    <div style="position:absolute;top:35px;bottom:0;left:0;right:0;border:1px solid black;">
        <div class="relativeRoot">
            <div class="absoluteBase leftTop w3-border">
                <div class="relativeRoot">
                    <div class="title w3-teal" style="height:50px;">
                        入力値
                    </div>
                    <div class="absoluteBase" style="top:50px">
                        <textarea id="inputText" style="100%;height:100%">//a1
public string b1; //c1

//a2
public string b2; //c2

//a3
public string b3; //c3
</textarea>
                    </div>
                </div>
            </div>
            <div class="absoluteBase rightTop w3-border">
                <div class="relativeRoot">
                    <div class="title w3-teal" style="height:50px;">
                        Regex
                    </div>
                    <div class="absoluteBase" style="top:50px">
                        <textarea id="inputRegex" style="100%;height:100%">//(.+)
.*public string (.+); //(.+)</textarea>
                    </div>
                </div>
            </div>
            <div class="absoluteBase leftBottom w3-border">
                <div class="relativeRoot">
                    <div class="title w3-teal" style="height:50px;">
                        出力テキスト
                    </div>
                    <div class="absoluteBase" style="top:50px">
                        <textarea id="outputText" style="100%;height:100%"></textarea>
                    </div>
                </div>
            </div>
            <div class="absoluteBase rightBottom w3-border">
                <div class="relativeRoot">
                    <div class="title w3-teal" style="height:50px;">
                        出力値可視化
                    </div>
                    <div id="outputView" class="absoluteBase" style="top:50px">

                    </div>
                </div>
            </div>
        </div>
        
    </div>
</body>
</html>

查看全文

相关阅读:
isinstance函数
 Django之ORM那些相关操作
 Django ~ 2
Django ~ 1
Django详解之models操作
 Django模板语言相关内容
 livevent的几个问题
 客户端，服务器发包走向
 关闭客户端连接的两种情况
 std::vector<Channel2*> m_allChannels;容器，以及如何根据channelid的意义

原文地址：https://www.cnblogs.com/wangjixianyun/p/6854573.html