無法使用Chrome開發工具檢查元素

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