Как управлять iframe

Ответ

Управлять iframe можно через JavaScript, используя его DOM-элемент или объект contentWindow. Основные методы:

  1. Доступ к содержимому:
    const iframe = document.getElementById('myIframe');
    const iframeDoc = iframe.contentDocument || iframe.contentWindow.document;
  1. Изменение src:
    iframe.src = 'https://example.com';
  1. Общение между окнами (если домены совпадают или CORS настроен):

    • Родитель → iframe:

      iframe.contentWindow.postMessage('Hello', 'https://iframe-origin.com');
    • iframe → родитель:

      window.parent.postMessage('Hi', 'https://parent-origin.com');
  2. События:

    iframe.onload = () => console.log('iframe загружен');

Важно: доступ к содержимому возможен только при соблюдении политики одинакового источника (Same-Origin Policy). Для кросс-доменных iframe используйте postMessage.

Ответ 18+ 🔞

А, ну это ж классика, блядь! Управлять iframe'ом — это как пытаться договориться с соседом через забор, который сам же и построил, ёпта. Смотри, как это работает, без всякой этой заумной хуйни.

Вот представь, у тебя есть этот самый iframe, да? Первым делом его надо поймать, как кота за жопу.

const iframe = document.getElementById('myIframe');

Вот он, сука, наш объект манипуляций. Теперь, чтобы внутри его ковыряться, надо до его документов добраться. Это как в чужую квартиру залезть, только законно (иногда).

const iframeDoc = iframe.contentDocument || iframe.contentWindow.document;

Эта строчка — универсальный отмычка. Берёт то, что дают. Главное, чтобы домены совпадали, а то тебе вежливо намекнут на политику одинакового источника, и будет тебе, как Герасиму с Муму, печаль-тоска.

Хочешь отправить iframe'а в другую вселенную? Легко! Меняешь ему src, и он, не пикнув, полетит куда скажешь.

iframe.src = 'https://example.com';

А вот самое интересное, блядь, — это когда нужно пообщаться. Если iframe с твоего же домена, то можно просто кричать через забор. Но если он с чужого — тут уже нужна дипломатия, ёперный театр! Используем postMessage, это как отправлять записки через нейтральную полосу.

Из основного окна в iframe кричим:

iframe.contentWindow.postMessage('Hello', 'https://iframe-origin.com');

А из iframe'а обратно, в родительское окно, отвечаем:

window.parent.postMessage('Hi', 'https://parent-origin.com');

И не забудь слушать, что тебе в ответ шлют! Вешай обработчик на message, а то прослушаешь всё, как глухонемой Герасим.

Ну и куда же без событий, блядь? Хочешь знать, когда iframe наконец-то загрузится и перестанет тормозить?

iframe.onload = () => console.log('iframe загружен, ура, блядь!');

И главное, запомни, как отче наш: если домены разные, то лезть руками в contentDocument — это как совать хуй в розетку. Только postMessage и ничего больше. Иначе браузер тебе такого наговорит, что мало не покажется. Всё, вопрос исчерпан, иди работай.