Question

我正在制作代码测试人员，我想知道如何为我的代码测试人员制作一个保存按钮。我的目的是将它保存为＆＃34; u＆＃34;中的.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 -->

Answer 1

你可以使用这个功能：

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>');

Answer 2

我不是100％确定您要查找的内容，但如果已知html文件，您可以在this

等标记中为其设置下载属性

<a href="/test.html" download>

如何创建一个将生成.html文件的保存按钮？

2 个答案: