使用 JS 或 Jquery 访问 iFrame 元素-解网

问：

我正在尝试通过javascript访问其中的元素并在控制台中打印其内容。但是，经过多次尝试后，它总是无法这样做。<p>iFrame

以下是主页的代码：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>CS3 - Test Page</title>
    <script src="https://code.jquery.com/jquery-3.7.0.js" integrity="sha256-JlqSTELeR4TLqP0OG9dxM7yDPqX1ox/HfgiSLBj8+kM=" crossorigin="anonymous"></script>
</head>

<body>
    <iframe id="frame" src="https://cs3.bluenest.it/Website/test.html"></iframe>

    <script>
        //script to access the iframe and print the contents of the p tag with the id='text'
    </script>
</body>

</html>

下面是在 iframe 中实例化的子页面（test.html）的代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <p id="text"> this text should get printed in the console </p>
</body>
</html>

我尝试了来自不同来源的多种方法，但它们都无法实现我的目标：

https://learningjquery.com/2016/09/using-jquery-to-access-iframe-elements 方法

var frame = $("frame").contents();
var element = frame.find("#text");
console.log("content of #text: " + element.html());

变量保持未定义状态，控制台打印”elementcontent of #text: undefined"

https://www.w3schools.com/howto/howto_js_element_iframe.asp 方法

var frame = document.getElementById("frame");
var element = frame.contentWindow.document.getElementById("text");
console.log("content of #text: " + element.html());

该变量最终为 null，控制台打印出错误”elementUncaught TypeError: Cannot read properties of null (reading 'html')"

使用 jQuery 在 iframe 中选择元素的方法

var iframe = $('frame');
var element = $('#text', iframe.contents());
console.log("content of #text: " + element.html());

变量保持未定义状态，控制台打印”elementcontent of #text: undefined"

JavaScript HTML jQuery iframe

使用 JS 或 Jquery 访问 iFrame 元素

Access iFrame Elements with JS or Jquery

评论