У меня есть требование доступа к элементу элемента 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?
Спасибо за ваш опыт.
Там нет удобного имущества, которое даст вам эту информацию.
Самое близкое, что вы сделали бы, - это перебрать все кадры в родительском документе, пока вы не найдете тот, который содержит тот же документ.
<!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>