Вот фрагмент кода, который использует сценарий для заполнения содержимого фрейма:Рабочих из IFRAME
<!doctype html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script>
$(document).ready(function() {
$('iframe').contents().find('body').html('<script>console.log($("div"))<\/script>');
});
</script>
</head>
<body>
<div>Test</div>
<iframe />
</body>
</html>
При выполнении мы видим, что IFrame имеет доступ к родительскому DOM, и мы видим DIV выбирается селектором jQuery. В iframe не включен jQuery, но он может получить доступ к объекту jQuery родителя.
Однако, если мы пишем то же самое с помощью включения Src Iframe, поведение отличается:
test.html:
<!doctype html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
</head>
<body>
<div>Test</div>
<iframe src="another.html">
</body>
</html>
another.html:
<!doctype html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script>
$(document).ready(function() {
console.log($('div'));
});
</script>
</head>
<body>
</body>
</html>
теперь см., что на странице не отображаются никакие div. Кроме того, если мы не включим jQuery js на дочерней странице, это приведет к ошибке.
Обратите внимание, что обе страницы находятся в одном домене, поэтому у нас нет проблем с политикой того же происхождения.
Мои вопросы:
- Почему поведение отличается для 2 - а. манипулирование iframe DOM от родителя и b. включая содержимое iframe через src?
- Есть ли способ заставить родителя иметь доступ к ребенку, а НЕ наоборот?
Можете ли вы прояснить свой тестовый пример. Что вы испытываете? Испытательные случаи не кажутся равными. – Halcyon
Позвольте мне пояснить - в одном я сгенерировал HTML внутри iframe программно через jQuery, а в другом я делаю это, включив src, который содержит код. Я сделаю это похожим, если вы захотите, но если я сделаю второй, это вызовет ошибку. Если вы видите вывод 2, первый возвращает div родительской страницы, а второй - нет. – buzypi