选择 iframe 内的内容答案

【问题标题】：Selecting content inside of iframe选择 iframe 内的内容
【发布时间】：2013-07-02 16:55:25
【问题描述】：

我正在处理的项目的设计具有实时聊天插件和标题上的在线/离线图像。我正在尝试编写在代理在线时放置“在线”图像的脚本。

插件的标题显示状态，像这样

<span __jx__id="___1_livehelpbutton__agentstatus" class="agentStatus" style>Offline</span>

我想获取标签的 innerHTML 并在 if 语句的条件下使用它，如果状态为“在线”，则显示“在线”图像，否则显示离线图像。那就是我遇到问题的地方。我在选择此标签时遇到问题。当我在控制台上尝试这个时，我得到 [] 并且屏幕上没有任何变化。

$('.agentStatus').css('background','red');

当作为 CSS 页面上的测试时，我尝试使用 .agentStatus { background: red; }，背景变为红色。

它所在的 iframe 没有不同的 url：

<iframe __jx__id="___$13__iframe src="javascript:void(document.write('<!DOCTYPE HTML PUBLIC -//W3C//DTD HTM…order-box}</style></head><body></body></html>'), document.close())" frameborder="0" style=" background-color: transparent; vertical-align: text-bottom; overflow: hidden; position: relative; width: 100%; height: 100%; margin: 0px; z-index: 999999;">
    #document
        <!DOCTYPE html PUBLIC"-W3C//DTD HTML 4.0 Transitional/EN" "http:www.w3.org/TR/html4/loose.dtd"
            <html style="overflow-y: hidden">
                 ...

【问题讨论】：

这不应该像$("#status").removeClass("offline").addClass("online");这么简单吗？
是的，if 语句中的代码相当简单。我遇到的问题是 if 语句的条件部分的选择器。

标签： javascript jquery

【解决方案1】：

问题在于，如果不先抓取iframe 显示的文档，您就无法访问iframe 中的内容。

post 解释得比我好。

在 JavaScript 或 jQuery 中没有实际的方法来执行此操作，除非 iframe 的源位于同一域中（研究“跨域和 JavaScript”）。但是，如果它们在同一个域中，您应该能够使用以下方法选择（和操作）元素：

$("#iframeID").contents().find(".agentStatus").css("background", "red");

这个post 也展示了一些替代解决方案。

【讨论】：

成功了 $("#iframeID").contents().find(".agentStatus").css("background", "red");
很高兴为您提供帮助 :) 祝您好运！