Как получить доступ к элементу iframe из его дочернего элемента

1

У меня есть требование доступа к элементу элемента iframe из его дочернего элемента в функцию обработчика события.

Пример будет таким.

function callback(ev) {
  //get the event target element
  var targetElement = ev.target;

  //get the document object of the target element
  var doc = targetElement.ownerDocument;

  //Question: how to get to the doc iframe object
  // I tried these properties below, both returns null
  var ifrmEle = doc.parentElement;
  var ifrmEle = doc.parentNode;
}

Скажем, TargetElement является элементом body в приведенном выше примере. Итак, мой вопрос в том, как я могу получить доступ к элементу iframe, которому принадлежит элемент body?

Спасибо за ваш опыт.

Теги:
iframe

1 ответ

0

Там нет удобного имущества, которое даст вам эту информацию.

Самое близкое, что вы сделали бы, - это перебрать все кадры в родительском документе, пока вы не найдете тот, который содержит тот же документ.

Родительский документ

<!DOCTYPE html>
<meta charset="utf-8">
<title>Iframe Parent</title>
<h1>Iframe Parent</h1>
<iframe src="iframe.html" name="one"></iframe>
<iframe src="iframe.html" name="two"></iframe>
<iframe src="iframe.html" name="three"></iframe>
<iframe src="iframe.html" name="four"></iframe>

Детский документ

<!DOCTYPE html>
<meta charset="utf-8">
<title>Iframe</title>
<h1>Iframe</h1>
<p>This document is in a frame named <span>?</span>.</p>
<script>
    parent.document
    .querySelectorAll('iframe, frame')
    .forEach(frame => {
        if(frame.contentWindow.document === document) {
            document.querySelector('span').textContent = frame.name;
        }
    });
</script>

Ещё вопросы

Сообщество Overcoder
Наверх
Меню