Wie Zugriff auf lokale JSON-Datei und Menü mit Inhalten auf reinem JavaScript und AJAX laden?

Question

Ich habe Probenstruktur für einige Web-Vorlage:

<div class="navbar"> 
     <a id="home" href="#"></a> 
     <a id="about" href="#"></a> 
     <a id="team" href="#"></a> 
     <a id="contact" href="#"></a> 
    </div> 

    <div> 
     <p id="content"></p>   
    </div> 

und lokale menu.json Datei:

[ 
    {"value":"Home" , "content":"This is default Home Page"}, 
    {"value":"About" , "content":"This is default About Page"}, 
    {"value":"Team" , "content":"This is default Team Page"}, 
    {"value":"Contact" , "content":"This is default Contact Page"} 
] 

Ich will nur mit Ajax-Request dynamisch Menüpunkte und dann Inhalt in einen Absatz laden. Aber das Problem ist, dass ich nicht auf die Datei menu.json zugreifen kann. Bitte helfen Sie mir, das ist meine js Datei jetzt:

function loadJSON() { 
    var request; 
    if (window.XMLHttpRequest) { 
     request = new XMLHttpRequest(); 
    } else { 
     request = new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
    request.open('GET', 'menu.json'); 
    request.onreadystatechange = function() { 
     if((request.readyState===4) && (request.status===200)) { 
      var items = JSON.parse(request.responseText); 
      console.log(items); 
     } 
    } 
    request.send(); 
} 

Answer 1

Das in mozzila FF arbeiten kann, wenn Sie versuchen, diese Arbeit machen wollen, einen Webserver mit es in allen Browsern funktionieren, dies ist aufgrund überqueren Browserrichtlinie Sicherheit