How to read and load data from local file when page loads-CodePudding

I would like to load local file data & populate that data while page loads.

I tried to use this jquery function

<script type="text/javascript">
   jQuery(document).ready(function ($) {
       $("div.footerText").load("footerText.txt");
   });
</script>

But this results in following error

Access to XMLHttpRequest at 'file:////footerText.txt' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome-extension, edge, https, chrome-untrusted.

Basically I am trying to write a simple HTML page which loads data into different div by reading files that are in the same code base. here is rough structure of html

<head>...</head>
<body>
  <div id="headerText">
  <div id="mainText">
  <div id="footerText">
  <script type="text/javascript">

    jQuery(document).ready(function ($) {
        $("div#headerText").load("headerText.txt");
        $("div#mainText").load("mainText.txt");
        $("div#footerText").load("footerText.txt");
    });
  </script>
</body>

CodePudding user response：

I think you should not do that.. and that seems kinda impossible. Have a look at this QA for more details

CodePudding user response：

you cannot due to security reasons thats why you are getting this error