javascript - 使用 jquery 访问 iframe 的 a我看过一些关于访问 iframe 内数据的文章，所以我在 iframe 中加载的页面中有一个像这样的表：<table class="table">...</table> 所以我只想在那个 iframe 中显示这个表，没有任何标题或其他 div 或任何东西 我怎么能用 jQuery 做到这一点？

Question

我看过一些关于访问 iframe 内数据的文章，所以我在 iframe 中加载的页面中有一个像这样的表：<table class="table">...</table>

所以我只想在那个 iframe 中显示这个表，没有任何标题或其他 div 或任何东西

我怎么能用 jQuery 做到这一点？

更新：

html 代码如下所示：我将表格添加到<div>

<div id="test">
<br>
<table class="table">
<thead>
<tr>
<th> ...... // and so on

所以，我只想在那个 iframe 中显示这个 div

阿迪尔的更新：

$(window).load(function () {
        var filteredContents = $('.test').contents().find('.div_iframe').html();
        $('.test').contents().find('body').html(filteredContents);
});

HTML 看起来像这样：

<iframe class="test" width="100%" height="100%" src="/message.html?msjId=268" style="height:100%;width:100%;">
<iframe class="test" width="100%" height="100%" src="/message.html?msjId=260" style="height:100%;width:100%;">

以及现在应该显示的表格，它们应该是两个不同的表格，但目前两者都是同一张表格，但与第一个表格msjId重复msjId...

Answer 1

尝试以下操作：

$('iframe-id').contents().find('body').html($('.table').html());

但 iframe 页面必须与您的包含页面来自同一个域，否则您将收到权限被拒绝错误。

Answer 2

您必须使用 jquery 加载方法而不是准备好。加载时确保加载 iFrame html。另一方面，ready 确保当前页面中的 html 元素准备就绪。

$(window).load(function () {  
      var filteredContents = $('#iframeId').contents().find('.table').html();
      $('#iframeId').contents().find('body').html(filteredContents);
});

根据 OP 请求进行更新。

当你有两个元素时，你可以使用 ids 而不是 class，请阅读选择器

<iframe id="frame1" width="100%" height="100%" src="/message.html?msjId=268" style="height:100%;width:100%;">
<iframe id="frame2" width="100%" height="100%" src="/message.html?msjId=260" style="height:100%;width:100%;">

 $(window).load(function () {
     var filteredContents1 = $('#frame1').contents().find('.div_iframe').html();
     $('#frame1').contents().find('body').html(filteredContents1);

     var filteredContents2 = $('#frame2').contents().find('.div_iframe').html();
     $('#frame2').contents().find('body').html(filteredContents2);

 });