iframe子页面获取父页面元素的方法

在HTML5中，子页面（iframe的内容页面）可以直接通过JavaScript来获取父页面（也称为顶层窗口或者包含它的窗口）的元素，但这受限于同源策略。以下是几种常用的方法：

1. **`window.parent` 或 `window.top`**: 这些属性直接引用了iframe所在的父窗口。例如：

   var parentElement = window.parent.document.getElementById('parentElementId');

2. **事件冒泡**: 子页面可以监听父页面上特定元素的事件，然后在回调函数里操作父页面元素。比如：

   parentElement.addEventListener('customEvent', function(e) {
       var elementInParent = e.target;
   });

3. **使用`postMessage`** (只在同源的前提下)：如前文所述，可以在父页面向子页面发送消息，然后子页面响应并获取信息。先在父页面设置监听，然后触发：

   parentElement.addEventListener('click', function() {
     window.frames['childFrameName'].contentWindow.postMessage('getMe', '*');
   });

   // 在子页面的`message`事件处理器中获取元素
   window.addEventListener('message', function(e) {
     if (e.origin !== 'http://parent.com') return;
     const parentElement = document.getElementById('parentElementId');
     // 对parentElement做操作
   });

4. **`document.domain`设置** (仅限于同域名下的子页面)：对于某些老版本浏览器，设置`document.domain`可以使iframe有更宽泛的权限访问父页面元素，但这是不推荐的做法，因为它会牺牲安全性。

请注意，这些方法都有一定的局限性，特别是当涉及到跨域（不同域名）时，因为浏览器的安全策略会更为严格。