0

我试图更改 iframe 中内容的 css。即我需要隐藏<img>元素。但我不能改变..这是示例代码：

<!DOCTYPE html>

<html>

<head>

  <script src="http://code.jquery.com/jquery-latest.js"></script>

</head>

<body>

  <iframe src="http://www.carsales.com.au/pls/carsales/!dealer_content.welcome?dealer_id=10978" width="80%" height="600" id='frameDemo'></iframe> 

<script>
  $("#frameDemo").contents().find("img").css("display", "none");
</script>



</body>

</html>

请帮我

亲切的问候鸟吉娜

4

2 回答 2

0

那里有几个问题。

主要问题是您遇到了Same Origin Policy。您没有脚本访问来自与运行脚本的页面不同的来源的框架内容。

如果框架的内容来自同一来源，您可能希望等待load框架内容上的事件。示例：Live Copy | 直播源

var frame = $("<iframe>");
frame.load(frameLoaded);
frame.attr("src", "http://jsbin.com/inanin/1");
frame.appendTo(document.body);

function frameLoaded() {
    frame.contents().find("img").hide();
}

但同样，主要问题是 SOP。

于 2013-07-03T05:22:54.037 回答
0

如果 iframe 源由您控制：

简单的答案是您需要将 iframe 完全视为一个单独的网页，因为确实如此。它应该有自己的 CSS/JS 文件等，这将允许您根据需要对其进行操作。

如果您希望以更动态的方式对其进行操作，您可以将一个变量附加到 iframe src URL（很像您已经存在的经销商 ID），然后使用 JS 检查变量值/存在并添加一个特定的类相应地您的图像。

iframe 源的示例结构

iframe-content.html?imgvar=隐藏

iframe-style.css - 在此处定义隐藏样式（例如：.hide{display:none;}）

iframe-script.js - 使用它来检查 src URL 中的变量，如果存在则将隐藏类添加到 img。

于 2013-07-03T06:20:02.347 回答