Javascript 我如何制作一个保存按钮来生成一个.html文件？_Javascript_Html

Javascript 我如何制作一个保存按钮来生成一个.html文件？

javascript html

Javascript 我如何制作一个保存按钮来生成一个.html文件？,javascript,html,Javascript,Html,我正在做一个代码测试器，我想知道如何为我的代码测试器创建一个保存按钮。我的目的是将其另存为网站“u”目录中的.html文件，然后向他们显示保存代码的链接。这是我的密码： <iframe src="menu-bar.html" height="45" width="1300" align="right" scrolling="no" frameborder="0"></iframe> <b

我正在做一个代码测试器，我想知道如何为我的代码测试器创建一个保存按钮。我的目的是将其另存为网站“u”目录中的.html文件，然后向他们显示保存代码的链接。这是我的密码：

                    <iframe src="menu-bar.html" height="45" width="1300" align="right" scrolling="no" frameborder="0"></iframe>
                    <br />
                    <br />
                    <br />
                            <!-- Code Tester Starts -->
        <div class="center-page">
        <!-- Code Tester Scripts Starts -->
                    <script src="http://jswebsite.co.nf/code-tester-javascript.min.js"></script>
        <!-- Code Tester Scripts End -->
                    <p>If you press Ctrl + Enter, the code will open in a new tab. If you press the "Test HTML Code" button, the code will open in a new window if you are using a Chrome browser.
                    <br />Please resize the code box if needed.</p>
        <p style="font-size:23px; color: white;">Code Tester for HTML:</p>
    <form name="tester">
    <textarea rows="20" cols="120" name="code-box" wrap="physical" id="codebox" spellcheck="false"></textarea>
            <br />
            <input type="button" value="Test HTML Code" onclick="preview()">
            <input value="Clear HTML Code" type="reset">
            <button onclick="TogetherJS(this); return false;">Collaborate</button>
        </form>
                    </div>
                    <!-- Code Tester Ends -->








如果按Ctrl+Enter，代码将在新选项卡中打开。如果您按下“测试HTML代码”按钮，如果您使用的是Chrome浏览器，代码将在新窗口中打开。

如果需要，请调整代码框的大小
HTML代码测试仪：


合作

您可以使用此功能：

function save(filename, html) {
  var el = document.createElement('a');
  el.setAttribute('href', 'data:text/html;charset=utf-8,' + encodeURIComponent(html));
  el.setAttribute('download', filename);
  el.style.display = 'none';
  document.body.appendChild(el);
  el.click();
  document.body.removeChild(el);
}

用法：

save('test.html', '<html></html>');

save（'test.html'，''；

您可以使用此功能：

function save(filename, html) {
  var el = document.createElement('a');
  el.setAttribute('href', 'data:text/html;charset=utf-8,' + encodeURIComponent(html));
  el.setAttribute('download', filename);
  el.style.display = 'none';
  document.body.appendChild(el);
  el.click();
  document.body.removeChild(el);
}

用法：

save('test.html', '<html></html>');

save（'test.html'，''；

我不能100%确定你在找什么，但是如果html文件已经知道，你可以在一个标签中为它设置一个下载属性，比如

除非使用文件API，否则无法将文件保存到客户端计算机。我甚至不确定API是否允许实际保存。出于安全原因，没有简单的方法（没有@moisrex的答案中那样的黑客）可以通过触发ctrl+s键下事件来实现。除非使用文件API，否则无法将文件保存到客户端计算机。我甚至不确定API是否真的允许保存。出于安全原因，没有简单的方法（没有@moisrex的答案中那样的黑客）可以通过触发ctrl+s键下事件来实现。在我看来，这是一种黑客方法，但这也是最好的方法。由于安全原因，不支持使用按键事件发出ctrl+s，因此…@sotn即使我们可以为用户按

ctrl+s

，这也不是一个好方法。用户可能已经将一些JS代码放入html中，Ctrl+S也会保存这些更改。对于@Joshua来说，进入窗口并按下Ctrl+S键更痛苦。对不起，我只是编辑了描述。我希望它保存在“u”目录，我在我的网站上，然后向他们显示链接，将他们保存的文件。示例：@Joshua将其保存在您的服务器中不是JS的工作描述。您需要使用服务器端编程语言，如PHP、ASP.NET、JAVA、PYTHON等。您需要javascript的唯一部分是用于向服务器发送html代码的ajax。在我看来，这是一种黑客方法，但也是最好的方法。由于安全原因，不支持使用按键事件发出ctrl+s，因此…@sotn即使我们可以为用户按

ctrl+s

，这也不是一个好方法。用户可能已经将一些JS代码放入html中，Ctrl+S也会保存这些更改。对于@Joshua来说，进入窗口并按下Ctrl+S键更痛苦。对不起，我只是编辑了描述。我希望它保存在“u”目录，我在我的网站上，然后向他们显示链接，将他们保存的文件。示例：@Joshua将其保存在您的服务器中不是JS的工作描述。您需要使用服务器端编程语言（如PHP、ASP.NET、JAVA、PYTHON等）来实现这一点。您需要javascript的唯一部分是用于向服务器发送html代码的ajax。