Question

我正在用Electron开发一个应用程序，在此页面上，我已经放置了一个按钮，但是单击该脚本不会运行。任何帮助将不胜感激。

<!DOCTYPE html>
<html>
    <head>
        <link class="menu-bar" rel="stylesheet" href="../css/index.css">
        <link class="main" rel="stylesheet" href="../css/ceaser.css">
        <meta charset="utf-8">
        <title>Cipher Program</title>

    </head>

<body>
    <!-- Navigation Bar -->
    <ul class = "menu-bar">
        <li><a href="index.html"> Menu </a></li>
        <li><a class="active" href="ceaser.html">Ceaser Cipher</a></li>
        <li><a href="vernam.html">Vernam Cipher </a></li>
        <li><a href="frequency.html">Frequency Analysis</a></li>
    </ul>

    <div class="main">

        <h1>Ceaser Cipher</h1>
        <button type="button" onclick="test()">Click me </button>
        <script type="text/javascript">
            function test() {
            console.log("got this far")
        }
        </script>

    </div>


</body>

Answer 1

为.js添加一些CDN以使用javascript库函数，因为我看到没有导入的库可以使用javascript这样的库 <script src="your_js/cdn"....></script>

Answer 2

您的代码应在Browserconsole中输出一些内容。您可以使用 Ctrl + Alt + i 打开Developertools afaik。

要输出/连接Main应用程序，您应该使用IPC。参见：https://electronjs.org/docs/api/ipc-main

礼物

Answer 3

Console.log将在终端窗口中显示文本。如果您试图在浏览器中显示某些内容，则必须更改DOM。

<!DOCTYPE html>
<html>
    <head>
        <link class="menu-bar" rel="stylesheet" href="../css/index.css">
        <link class="main" rel="stylesheet" href="../css/ceaser.css">
        <meta charset="utf-8">
        <title>Cipher Program</title>

    </head>

<body>
    <!-- Navigation Bar -->
    <ul class = "menu-bar">
        <li><a href="index.html"> Menu </a></li>
        <li><a class="active" href="ceaser.html">Ceaser Cipher</a></li>
        <li><a href="vernam.html">Vernam Cipher </a></li>
        <li><a href="frequency.html">Frequency Analysis</a></li>
    </ul>

    <div class="main">

        <h1>Ceaser Cipher</h1>
        <div id="message"></div>
        <button type="button" onclick="test()">Click me </button>
        <script type="text/javascript">
            function test() {
            console.log("got this far");
            
  document.getElementById("message").appendChild(document.createTextNode("You see me now"));
        }
        </script>        

    </div>
</body>

最简单的方法是使用您选择的ID创建一个空的“ div”。然后在javascript中使用文档对象“ document”，其功能类似于“ .write”或“ .appendChild”，以更改DOM。

您应该能够在堆栈溢出沙箱中运行以上代码，并看到终端（console.log）的输出不同于浏览器呈现的DOM（getElementById（“ message”）。appendChild）

在Electron中单击按钮时使脚本运行

3 个答案: