showOpenFilePicker结合CodeMirror实现浏览器上打开和修改本地文件代码-html代码-BFW代码库

showOpenFilePicker结合CodeMirror实现浏览器上打开和修改本地文件代码

代码语言：html

所属分类：其他

代码描述：showOpenFilePicker结合CodeMirror实现浏览器上打开和修改本地文件代码，通过使用file access api实现了浏览器端使用js来读取和修改本地电脑的文件功能。

代码标签： showOpenFilePicker CodeMirror 打开本地文件修改本地文件

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html>

<head>
    <script src="//repo.bfw.wiki/bfwrepo/js/eruda.js"></script>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum=1.0,minimum=1.0,user-scalable=0" />
    <title>BFW NEW PAGE</title>
    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/bootstrap.4.3.1.min.css">
    <style>
        body{
            padding: 10px;
        }
    </style>
    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/codemirror.css">

    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/codemirror/theme/xq-dark.css">
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/codemirror/codemirror.5.26.js"></script>
    <script src='//repo.bfw.wiki/bfwrepo/js/codemirror/mode/xml/xml.js'></script>
    <script src='//repo.bfw.wiki/bfwrepo/js/codemirror/mode/css/css.js'></script>
    <script src='//repo.bfw.wiki/bfwrepo/js/codemirror/mode/javascript/javascript.js'></script>
    <script src='//repo.bfw.wiki/bfwrepo/js/codemirror/mode/htmlmixed/htmlmixed.js'></script>
</head>

<body>
    <p><button id="openlocalfile">打开本地文件</button>

        <button id="savetolocalfile">保存到本地</button>不要在iframe中打开</p>

    <textarea id="editor"></textarea>
    <script>
        var editor = CodeMirror.fromTextArea(document.getElementById("editor&.........完整代码请登录后点击上方下载按钮下载查看