Отримати елемент з iFrame

Як отримати <div>зсередини <iframe>?

var iframe = document.getElementById('iframeId');
var innerDoc = (iframe.contentDocument) ? iframe.contentDocument : iframe.contentWindow.document;

Ви могли б простіше написати:

var iframe = document.getElementById('iframeId');
var innerDoc = iframe.contentDocument || iframe.contentWindow.document;

і перший дійсний внутрішній документ буде повернутий.

Щойно ви отримаєте внутрішній документ, ви можете просто отримати доступ до його внутрішніх даних так само, як і будь-який елемент на вашій поточній сторінці. ( innerDoc.getElementById... тощо)

ВАЖЛИВО: Переконайтеся, що iframe знаходиться в одному домені, інакше ви не можете отримати доступ до його внутрішніх даних. Це буде сценарій між сайтом.

Не забудьте отримати доступ до iframe після завантаження . Старий, але надійний спосіб без jQuery:

<iframe src="samedomain.com/page.htm" id="iframe" onload="access()"></iframe>

<script>
function access() {
   var iframe = document.getElementById("iframe");
   var innerDoc = iframe.contentDocument || iframe.contentWindow.document;
   console.log(innerDoc.body);
}
</script>

window.parent.document.getElementById("framekit").contentWindow.CallYourFunction('pass your value')

CallYourFunction() це функція всередині сторінки та дія функції на ній

Наведені вище відповіді дали хороші рішення за допомогою Javscript. Ось просте рішення jQuery:

$('#iframeId').contents().find('div')

Хитрість тут полягає в .contents()методі jQuery , на відміну від .children()якого можна отримати лише HTML елементи, .contents()можна отримати як текстові вузли, так і HTML елементи. Ось чому можна отримати вміст документа iframe, використовуючи його.

Далі читайте про jQuery .contents(): .contents ()

Зауважте, що рамка і сторінка повинні бути на одному домені.

Жодна з інших відповідей не працювала для мене. Я в кінцевому підсумку створив функцію в межах своєї рамки iframe, яка повертає шуканий об’єкт:

function getElementWithinIframe() {
    return document.getElementById('copy-sheet-form');
}

Потім ви викликаєте таку функцію, як так, щоб отримати елемент:

var el = document.getElementById("iframeId").contentWindow.functionNameToCall();

Якщо iframe не в тому самому домені, що ви не можете отримати доступ до його внутрішніх даних від батьківського, але ви можете змінити вихідний код iframe, ви можете змінити сторінку, що відображається iframe, для надсилання повідомлень у батьківське вікно, що дозволяє Ви можете ділитися інформацією між сторінками. Деякі джерела:

• https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage
• Html5 - Повідомлення із перехресним переглядачем iframe - дитина до батьків?
• міжмісцевий сайт iframe postMessage від дитини до батьків

Нижче код допоможе вам з’ясувати дані iframe.

let iframe = document.getElementById('frameId');
let innerDoc = iframe.contentDocument || iframe.contentWindow.document;