怎么让iframe内的元素定位到iframe外的元素
时间: 2023-11-04 08:55:26 浏览: 47
要在iframe内的元素定位到iframe外的元素,可以使用postMessage()方法进行跨域通信。以下是实现的步骤:
1. 在iframe内部的脚本中,使用postMessage()方法将需要定位的元素的位置信息发送给父窗口。
```javascript
// 在iframe内部的脚本中
var elementPosition = document.getElementById('elementId').getBoundingClientRect();
window.parent.postMessage(elementPosition, '*');
```
2. 在父窗口的脚本中,监听message事件,获取从iframe发送的位置信息。
```javascript
// 在父窗口的脚本中
window.addEventListener('message', function(event) {
var elementPosition = event.data;
// 处理位置信息,定位到iframe外的元素
// ...
});
```
3. 在父窗口的脚本中,根据接收到的位置信息,定位到iframe外的元素。
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![doc](https://img-home.csdnimg.cn/images/20210720083327.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)