当您尝试从JavaScript中获取`iframe`的内容时，首先需要确保您有权访问该`iframe`的内容。如果`iframe`是同源（即，它的源和您尝试访问它的页面的源相同），则可以通过JavaScript访问其内容，否则，由于同源政策的限制，浏览器会阻止您这样做。

如果您有权访问`iframe`的内容，请按照以下步骤操作：

1. 首先，获取`iframe`元素的引用。例如，如果您知道`iframe`的ID，可以使用`document.getElementById`方法：
    ```javascript
    var iframe = document.getElementById('myIframe');
    ```

2. 接下来，您可以通过`iframe`的`contentDocument`属性或`contentWindow.document`属性来获取`iframe`中的文档对象（`document`）：
    ```javascript
    var iframeDocument = iframe.contentDocument || iframe.contentWindow.document;
    ```

3. 一旦有了文档对象，您就可以根据需要访问`iframe`的正文内容。例如，您可以获取`body`的HTML内容：
    ```javascript
    var iframeContent = iframeDocument.body.innerHTML;
    ```

这里有一个简单的例子，它在一个页面中演示了如何获取`iframe`的正文内容（假设`iframe`和父页面是同源的）：

```html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Iframe Content Access Example</title>
</head>
<body>
    <iframe id="myIframe" src="iframe-content.html" onload="getIframeContent()"></iframe>
    <script>
        function getIframeContent() {
            var iframe = document.getElementById('myIframe');
            var iframeDocument = iframe.contentDocument || iframe.contentWindow.document;
            var iframeContent = iframeDocument.body.innerHTML;
            console.log('Iframe content:', iframeContent);
        }
    </script>
</body>
</html>
```

在这个例子中，当`iframe`加载完成后，会自动调用`getIframeContent`函数，这个函数会获取并打印出`iframe`中的正文内容。

请注意，如果`iframe`来源于其他域，则出于安全考虑，浏览器的同源政策会阻止您访问`iframe`的内容。在这种情况下，解决方案通常涉及后端代理或允许跨域资源共享（CORS）的工作流程，这超出了此问题的范围。

How to get the body's content of an iframe in Javascript?

1个答案

你的答案