4

我试图弄清楚如何选择然后修改iframe我生成的 HTML。iframe 显示各种媒体（图像、pdf 等）。为了显示不同的项目，我最初使用以下内容创建它：

$('#mydiv').html("<iframe id='myiframe' src='path/file.jpg'></iframe>");

然后，根据需要，使用以下内容更新其内容：

$('#myiframe').attr("src","path/newfile.jpg");

这会产生这样的 HTML（通过 Chrome 的元素查看器可以看到）：

<div id='mydiv'>
  <iframe id='myiframe' src='path/file.jpg'>
    #document
      <html>
        <body style="margin:0">
          <img style="-webkit-user-select:none" src="path/file.jpg">
        </body>
      </html>
  </iframe>
</div>

我想选择动态生成的<img>标签，以便调整它的宽度。但我无法弄清楚 jquery 选择器来做到这一点。想法？

4

3 回答 3

13

使用 jQuerys内容方法。文档甚至有一个名为“更改 iframe 内链接的背景颜色”的示例。

获取匹配元素集中每个元素的子元素，包括文本和注释节点。

应用于您的代码：

var images = $('#myiframe').contents().find('img');

真正的问题是为什么首先需要 iframe？

于 2012-05-21T20:01:19.607 回答
4

您需要先获取 iFrame 的内容：

$("#myiframe").contents().find('img');
于 2012-05-21T20:01:41.277 回答
0

如果您只想动态更改容器中的图像，则不需要 iframe。

您只需要在自己的 html 上添加一个 img 标签，即可更新它的 src 属性。

$('#my-image')
    .attr('src', '/path/to/image')
    .attr('width', '100px')
    .attr('height', '100px');

除非您没有告诉我们为图像生成 iframe 的充分理由。当从其他域调用 URL 时，使用这样的 iframe 可能会很痛苦

于 2012-05-21T19:59:11.900 回答