Совместное использование глобальной переменной javascript страницы с помощью iframe на этой странице

Question

У меня есть сценарий, где у меня есть страница с тегом <script> и некоторыми глобальными переменными JavaScript.У меня также есть iframe на этой странице, и я хочу иметь доступ к глобальным переменным javascript страницы в iframe.

Возможно ли это? Если да, как я могу это сделать?

Answer 1

Легко вызывая parent.your_var_name в скрипте вашего iframe.

Одно условие: обе страницы (основная и iframe) должны находиться в одном домене.

главная страница:

<script>
 var my_var = 'hello world!';
</script>

IFrame

<script>
  function some_fn(){
    alert(parent.my_var); //helo world!
  }
</script>

Answer 2

Невозможно, если iframe и основной документ не находятся в одном домене (из-за междоменной политики безопасности).

Чтобы обойти это ограничение, вы можете использовать междоменный обмен сообщениями.

Возможно, если iframe основного документа находятся в одном домене, вы можете получить доступ к их глобальным переменным.Есть объект, который принадлежит объекту окна iframe или главной странице.

Вот код для доступа к переменной iframe myvar из основного документа (или iframe) в том же домене :

document.getElementById('iframeid').contentWindow['myvar'];

Answer 3

Отличные ответы выше.Просто добавьте, остерегайтесь этого в ES6:

 <script>
 const my_var2 = 'hello world!';
 let   my_var3 = 'hello world!';
 </script>

Если вы используете вышеупомянутое на главной странице, вы не можете ссылаться на my_var2 или my_var3 в iframe.Вы должны использовать 'var' для этого.

Это потому, что "const, let и class не создают свойств для глобального объекта".

SEE: Как правильно написать глобальный const в javascript es6?