我创建了一个API.AI聊天机器人，并在我的html文件中使用了它的“web demo”集成。我的意思是API.AI给了我一个嵌入式iframe，像这样：如何访问跨域API.AI iframe元素

<iframe id="ifrm" width="350" height="430" src="https://console.api.ai/api-client/demo/embedded/...."></iframe>

和我在我的HTML文件中使用它。

现在我想要得到<input>标签的文字，里面是上面的。

<input type="text" name="q" id="query" placeholder="Ask something...">

我试过不同的方法来得到这个<input>文本。例如：

$('#ifrm').contents().find("#query")

但结果是"undefined"。有没有人知道我应该怎么做才能在我的HTML文件中输入这个输入标签的文本？

在此先感谢

来源

2017-10-06 sun

如果iframe和你的网页是不一样的域下，您的浏览器不会让你到iframe中。但是，如果两者在同一个域中，则可以尝试类似于以下内容：

var iframe = document.getElementById("your_iframe_id"); 
var iframe_contents = iframe.contentDocument.body.innerHTML; 
var textbox = iframe_contents.getElementById("input_id");

首先，您获取对iframe的引用。 iframe有一个名为contentDocument的属性，它是一个包含所有html数据的document。你可以从那里抓取你的输入。

编辑

如果iframe和尝试交互的页面是不一样的域名下，浏览器将不允许你进行交互。这是出于安全原因。考虑一下，如果我可以在我的网页中嵌入任何网页，看起来是相同的，那么这个问题会有多大的问题，然后在代码中加入一些代码来监视按键等等。

定义从Javascript访问内容的所有规则的规则集称为same-origin policy。

来源

2017-10-06 07:55:33 Lite20

非常感谢，但它们不在同一个域下.iframe在API.AI域下，而我的html文件不在。所以我用上面的代码得到了这个错误：TypeError：iframe.contentDocument为null。有没有办法在不同的领域做这项工作？ – sun

出于安全原因，没有。我会更新我的答案来解释这一点。 – Lite20

如何访问跨域API.AI iframe元素

回答

编辑

相关问题