Vue直接讀取服務器文件並顯示的方法

本文轉載自查看原文 2021-03-25 16:36 1010 javascript

HTML代碼

<textarea id = "div1"  style="width:1650px; height:740px" readonly>
</textarea>

JS代碼

這里試用了兩種方法都可以

1.ajax

mounted() { 
        document.getElementById('div1').innerHTML = '讀取中...';
        $(document).ready(function(){
            $.ajax({async: true, url:"dhcpdlog",success:function(result){
                $("#div1").html(result);
            }});
        });
    }

2.load

mounted() {
    // this.getInfo()    
    document.getElementById('div1').innerHTML = '讀取中...';
    $(document).ready(function(){
    $("#div1").load("/arplog");
    });
  }

然后效果如圖所示

讀取中

讀取完畢

測試：

1.代碼

<!DOCTYPE html>
<html>

<body>
    <textarea id="div1" style="width:1650px; height:740px" readonly>
</textarea>
    <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
    <script type="text/javascript">
        document.getElementById('div1').innerHTML = '讀取中...';
        $(document).ready(function () {
            $.ajax({
                async: true, url: "text.txt", success: function (result) {
                    $("#div1").html(result);
                }
            });
        });
    </script>

</body>

</html>

2.test.txt

3.文件結構

4.使用http-server啟動一個服務后訪問（詳細參考：https://www.cnblogs.com/nolaaaaa/p/9126385.html）

參考：https://blog.csdn.net/princek123/article/details/82762083?utm_source=blogxgwz6

免責聲明！

本站轉載的文章為個人學習借鑒使用，本站對版權不負任何法律責任。如果侵犯了您的隱私權益，請聯系本站郵箱yoyou2525@163.com刪除。

猜您在找 python 讀取Linux服務器上的文件方法從服務器讀取圖片並顯示 Fiddler顯示服務器IP的方法如何從本機直接復制粘貼文件到服務器 svn 怎么直接同步指定服務器的某個文件夾 CSV文件在服務器上直接導入hive springmvc讀取服務器磁盤圖片，顯示於前台頁面 nginx服務器,訪問時如何不直接顯示index.php,而是顯示目錄 vue上傳文件到FTP服務器 Nodejs koa2讀取服務器圖片返回給前端直接展示