JSFiddle - React, Tailwind, and code Playground

HTML

<script>
  var globalValue = 1000;
  var globalCounter = function() {
    return globalValue++;
  };
</script>

<div>
  <button>iframe counter</button>
  <button>globalCounter</button><br >
  <button>frameValue</button>
  <button>globalValue</button>
</div>

JavaScript

const iframeHTML = 'iframe...<' + `script>
  var frameValue = 1;
  var counter = function() {
    // debugger;
    return frameValue++;
  };
  
  window.parent.iframeCounter = counter;
<` + '/script>';

function createTempFrame() {
	const blob = new Blob([iframeHTML], {type: "text/html"});
  const frm = document.createElement('iframe');
  frm.src = URL.createObjectURL(blob);
  
  document.body.appendChild(frm);
  
  setTimeout(() => {
  	document.body.removeChild(frm);
  }, 900);
}

window.onload = function () {
  const buttons = document.querySelectorAll('button');
  
  buttons[0].onclick = function() {
    alert(iframeCounter());
  };

  buttons[1].onclick = function() {
    alert(globalCounter());
  };
  
  buttons[2].onclick = function() {
    alert(window.frameValue);
  };
  
  buttons[3].onclick = function() {
    alert(window.globalValue);
  };
 
  createTempFrame();
};