Question

我有一个基本html文件（base.html），里面有一个使用（iframe.html）的iframe。 iframe仅在单击某个菜单项时显示。它们都托管在同一个域中。

在base.html中，我包含一个指向我使用的外部服务的脚本。包括脚本会返回一个存在于我页面上的对象。

<script type="text/javascript" src="externalSite.com/myID.js"></script>

在iframe.html中我有另一个脚本根据返回的对象的某些属性构建菜单

<script type="text/javascript" src="my_list_builder.js"></script>

my_list_builder.js的代码如下所示：

var myList = parent.externalAPI.getItems()
var listBlock = "<div><ul>"

for (var i = 0; i < myList.length; i++) {
    listBlock += '<li><span>'+ myList[i].Name + '</span></li>';
}

listBlock += '</ul></div>'

$('someElement').append(listBlock);

现在，此代码按预期执行，并将listBlock添加到我想要的页面，但是当我尝试检查Chrome中iframe中的任何元素时，我无法执行此操作。 iframe是我可以检查的最低级别元素，但它没有通常的下拉选项。如果我删除了my_list_builder.js，我可以毫无困难地检查iframe中的元素。

关于可能导致问题的任何想法？

Answer 1

尝试在iframe / non-iframe脚本中使用debugger关键字。只需将debugger;放在一行，就应该以编程方式在Chrome开发者工具（也是Firebug）中导致断点。更多信息：https://developer.mozilla.org/en/JavaScript/Reference/Statements/debugger

无法使用Chrome开发工具检查元素

1 个答案: