La primera página web contiene un botón 'hacer clic' (donde id = "btn") y cuando se hace clic en el botón, quiero mostrar el contenido de otra página web (archivos json) en div (donde id = "animal-info"). Cuando se vuelve a hacer clic en el botón, aparecerá contenido nuevo (siguiente json) en div en esa segunda página web. Primero probé con el almacenamiento local, pero al buscar en la web me di cuenta de que debería usar javascript websocket. Soy nuevo en el intercambio de datos entre páginas, por lo que podría necesitar ayuda en esto, por favor.
var pageCounter = 1; var animalContainer = document.getElementById("animal-info"); var btn = document.getElementById("btn"); btn.addEventListener("click", function(){ var ourRequest = new XMLHttpRequest(); ourRequest.open('GET','http://10.0.9.243/animals-'+ pageCounter + '.json'); ourRequest.onload = function(){ var ourData = JSON.parse(ourRequest.responseText); renderHTML(ourData); }; ourRequest.send(); pageCounter++; }); function renderHTML(data) { var htmlString = document.createElement("div"); for (i=0; i < data.length; i++){ let pText = document.createTextNode(data[i].name); let pElement = document.createElement("p"); pElement.append(pText); htmlString.append(pElement); htmlString.classList.add('containers') // new Line added } animalContainer.append(htmlString); } <h1>Press for number</h1> <button type="button" id="btn" class="blink"> click</button> <div id="animal-info"></div> <!--<p>to je broj: <span id="my"></span></p>--> <script src="skripta.js"></script> <h1>Press for number</h1> <button type="button" id="btn" class="blink"> click </button> <div id="animal-info"></div> <!--<p>to je broj: <span id="my"></span></p>--> <script src="skripta.js"></script> <h2>Numbers:</h2> <div id="animal-info"></div> <script src="skripta.js"></script>