前端js读取本地md或txt文件内容

html 复制代码
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>前端js读取本地md或txt文件内容</title>
  </head>
  <body>
    <script>
      function readTextFile(fileName) {
        var rawFile = new XMLHttpRequest()
        var filePath = location.origin + '/' + fileName
        rawFile.open('GET', fileName, false)
        rawFile.onreadystatechange = function () {
          if (rawFile.readyState === 4) {
            if (rawFile.status === 200 || rawFile.status == 0) {
              var allText = rawFile.responseText
              document.getElementById('showmd').innerHTML = allText
              console.log(666.20001, allText, location)
            }
          }
        }
        rawFile.send(null)
      }
    </script>
    <div id="showmd"></div>
    <button onclick="readTextFile('text.md')">测试按钮</button>
    <button onclick="readTextFile('public/text.md')">测试按钮2</button>
  </body>
</html>
相关推荐
Galloping-Vijay5 分钟前
解决 WSL2 + Windows Hosts + 开启 VPN 后无法访问本地 Web 服务的问题
前端·windows
不吃香菜的猪16 分钟前
使用@vue-office/pdf时,pdf展示不全
javascript·vue.js·pdf
wuhen_n21 分钟前
TypeScript的对象类型:interface vs type
前端·javascript·typescript
见路不走!22 分钟前
后端返回Blob文件流,前端实现导出
前端
lindd91191125 分钟前
4G模块应用,内网穿透,前端网页的制作第七讲(智能头盔数据上传至网页端)
前端·后端·零基础·rt-thread·实时操作系统·项目复刻
css趣多多35 分钟前
props,data函数,computed执行顺序
前端·javascript·vue.js
一个不称职的程序猿37 分钟前
构建优雅的 Vue.js 表情包选择器:一个功能丰富且可定制的 Emoji Picker 组件
前端·javascript·vue.js
无风听海43 分钟前
AngularJS中$q.when()的用法
javascript·ecmascript·angular.js
Charlie_lll43 分钟前
学习Three.js--光源Light+轨道控制器OrbitControls
前端·three.js
Amumu121381 小时前
Vue核心(二)
前端·javascript·vue.js