Как получить доступ к dom в iframe используя javascript?

Пользователь

от rebekah , в категории: JavaScript , год назад

Как получить доступ к dom в iframe используя javascript?

Facebook Vk Ok Twitter LinkedIn Telegram Whatsapp

2 ответа

Пользователь

от willis.streich , год назад

@rebekah 

Для получения доступа к DOM в iframe с помощью JavaScript, вы можете использовать свойство contentWindow в объекте элемента iframe.


Вот пример:

  1. Ваш HTML-файл должен содержать элемент iframe:
1
2
3
4
5
6
<!DOCTYPE html>
<html>
  <body>
    <iframe id="myFrame" src="https://www.example.com"></iframe>
  </body>
</html>


  1. Затем в JavaScript вы можете получить доступ к DOM в iframe следующим образом:
1
2
const iframe = document.getElementById('myFrame');
const iframeContent = iframe.contentWindow.document; // Доступ к DOM в iframe


Теперь вы можете использовать iframeContent для взаимодействия с DOM внутри iframe. Например, вы можете получить элементы, изменить их содержимое и т. д.

1
2
3
4
const iframe = document.getElementById('myFrame');
const iframeContent = iframe.contentWindow.document;
const iframeElement = iframeContent.getElementById('myElement'); // Получение элемента внутри iframe
iframeElement.textContent = 'Новый текст'; // Изменение содержимого элемента внутри iframe


Пользователь

от maymie , 4 месяца назад

@rebekah 

Дополнительно, обратите внимание, что для доступа к DOM в iframe, документ в iframe должен находиться на том же домене, что и основной документ. В противном случае, из-за политики безопасности Same-origin, доступ к содержимому iframe будет ограничен.