Question

是否可以在JS中创建基于控制台的应用程序？
这就是我现在所能达到的一切。我希望有一个基于浏览器控制台的应用程序而不是弹出提示：P

var fname=prompt("Command:","")
if (fname=="do_stuff") {alert("Ok, i will do stuff...")}
else {alert("You did not tell me something i know!")};

在我上面编写的Javascript程序中：首先是prompt框是一个if语句，用于检查用户是否输入了“do_stuff”，如果他没有...（“else”）那么它会显示一个警告框：你没有告诉我一些我知道的事情！ / p>

Answer 1

简短回答：您可以使用JavaScript 几乎任何。下面是一个示例控制台，它接受一个命令，后跟一个以空格分隔的参数集，类似于许多Windows命令行操作。

看起来你对JavaScript很陌生，你应该学习如何使用浏览器的核心......但我不知道你将使用什么浏览器，所以我的例子使用YUI框架，因此我的代码不会被浏览器规范化混乱。

尝试将以下内容另存为HTML文档。然后当您在浏览器中打开它时，请尝试“do_stuff arg1 George 9 howdy”或“greet Navweb”。我希望你能通过检查代码来弄清楚发生了什么。我担心我没有时间提出适当的意见。

<!doctype html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <meta http-equiv="X-UA-Compatible" content="IE=Edge"/>
        <title>Console</title>
        <link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/combo?3.5.0/build/cssreset/cssreset-min.css"/>
        <style type="text/css">
            html {
                background-color: #000;
                }
            body {
                font-family: "Lucida Console";
                font-size: 13px;
                color: #0f0;
                }
            #in {
                display: block;
                position: fixed;
                left: 0;
                bottom: 0;
                width: 100%;
                padding: 8px;
                border-color: #fff;
                border-width: 1px 0 0 0;
                background-color: #000;
                color: #0f0;
                }
        </style>
    </head>
    <body>
        <div id="out"></div>
        <input id="in" tabindex="0"/>
    </body>
    <script type="text/javascript" src="http://yui.yahooapis.com/combo?3.5.0/build/yui/yui-min.js"></script>
    <script type="text/javascript">
        YUI().use("node", function(Y) {

            var COMMANDS = [
                {
                    name: "do_stuff",
                    handler: doStuff
                },

                {
                    name: "greet",
                    handler: function(args) {
                        outputToConsole("Hello " + args[0] + ", welcome to Console.");
                    }
                }
            ];

            function processCommand() {
                var inField = Y.one("#in");
                var input = inField.get("value");
                var parts = input.replace(/\s+/g, " ").split(" ");
                var command = parts[0];
                var args = parts.length > 1 ? parts.slice(1, parts.length) : [];

                inField.set("value", "");

                for (var i = 0; i < COMMANDS.length; i++) {
                    if (command === COMMANDS[i].name) {
                        COMMANDS[i].handler(args);
                        return;
                    }
                }

                outputToConsole("Unsupported Command: " + command);
            }

            function doStuff(args) {
                outputToConsole("I'll just echo the args: " + args);
            }

            function outputToConsole(text) {
                var p = Y.Node.create("<p>" + text + "</p>");
                Y.one("#out").append(p);
                p.scrollIntoView();
            }

            Y.on("domready", function(e) {
                Y.one("body").setStyle("paddingBottom", Y.one("#in").get("offsetHeight"));
                Y.one("#in").on("keydown", function(e) {
                    if (e.charCode === 13) {
                        processCommand();
                    }
                });
            });
        });
    </script>
</html>

Answer 2

最简单，最兼容的方法是使用众多Javascript终端模拟器库中的一个，例如termlib，jqueryterminal等

Javascript控制台应用程序？

2 个答案: