javascript - 使用 Javascript 保存 HTML 文件的方法

Question

有没有办法使用 Javascript 在本地保存 HTML 文件？例如，我想保存这个使用 mxGraph 库制作图表的 HTML 代码。有没有办法在本地保存这个文件，例如，一个保存按钮调用一个 Javascript 函数来完成工作？

<!-- Sets the basepath for the library if not in same directory -->
<script type="text/javascript">
    mxBasePath = '/mxgraph/javascript/src';
</script>

<!-- Loads and initializes the library -->
<script type="text/javascript" src="/mxgraph/javascript/src/js/mxClient.js"></script>

<!-- Example code -->
<script type="text/javascript">
    // Program starts here. Creates a sample graph in the
    // DOM node with the specified ID. This function is invoked
    // from the onLoad event handler of the document (see below).
    function main(container)
    {
        // Checks if the browser is supported
        if (!mxClient.isBrowserSupported())
        {
            // Displays an error message if the browser is not supported.
            mxUtils.error('Browser is not supported!', 200, false);
        }
        else
        {
            // Disables the built-in context menu
            mxEvent.disableContextMenu(container);

            // Creates the graph inside the given container
            var graph = new mxGraph(container);
            // Enables rubberband selection
            new mxRubberband(graph);

            // Gets the default parent for inserting new cells. This
            // is normally the first child of the root (ie. layer 0).
            var parent = graph.getDefaultParent();

            // Adds cells to the model in a single step
            graph.getModel().beginUpdate();
            try
            {
                var v1 = graph.insertVertex(parent, null, 'Hello,', 20, 20, 80, 30);
                var v2 = graph.insertVertex(parent, null, 'World!', 200, 150, 80, 30);
                var e1 = graph.insertEdge(parent, null, '', v1, v2);
            }
            finally
            {
                // Updates the display
                graph.getModel().endUpdate();
            }


        }
    };
</script>

<!-- Creates a container for the graph with a grid wallpaper -->
<div id="graphContainer"
    style="overflow:hidden;width:1000px;height:400px;">
</div>

Answer 1

是的，应该可以

看看这个例子:http://jsfiddle.net/wared/fezc6tnt/

如果此人正在编写一段 HTML 以打印出来，您可以使用

document.querySelector("html").innerHTML

获取页面的所有 HTML。

一旦你有一个包含整个文档作为字符串的变量 - 我们可以使用以下函数下载它:

function download(filename, text) {
 var element = document.createElement('a');
 element.setAttribute('href', 'data:text/plain;charset=utf-8,' + 
 encodeURIComponent(text));
 element.setAttribute('download', filename);

  element.style.display = 'none';
  document.body.appendChild(element);

  element.click();

  document.body.removeChild(element);
}

请注意，这是来自外部来源的复制粘贴，用于展示如何轻松下载文本文件。