Javascript 无法在回调函数中使用getElementById_Javascript_Jquery_Google Chrome_Google Chrome Extension_Callback

Javascript 无法在回调函数中使用getElementById

javascript jquery google-chrome google-chrome-extension

Javascript 无法在回调函数中使用getElementById,javascript,jquery,google-chrome,google-chrome-extension,callback,Javascript,Jquery,Google Chrome,Google Chrome Extension,Callback,我在Chrome API的getAllFrames中有一个回调函数： chrome.webNavigation.getAllFrames({tabId: tabArray[0].id},getAllFramesCallback); 我在使用回调函数GetAllFrameScalBack从html文件tabStructure.html中查找元素ID时遇到问题，该文件是使用以下方法创建的： chrome.windows.create({url:"tabStructure.html", type:'

我在Chrome API的getAllFrames中有一个回调函数：

chrome.webNavigation.getAllFrames({tabId: tabArray[0].id},getAllFramesCallback);

我在使用回调函数GetAllFrameScalBack从html文件tabStructure.html中查找元素ID时遇到问题，该文件是使用以下方法创建的：

chrome.windows.create({url:"tabStructure.html", type:'popup', height:450, width:600, left:1500, focused:true});

tabStructure.html：

<!doctype html>

<html lang="en">
<head>
  <meta charset="utf-8" />
  <title>TabStructure</title>
  <link rel="stylesheet" href="./jquery-ui-1.10.3/themes/base/jquery-ui.css" />
  <script src="./jquery-ui-1.10.3/jquery-1.9.1.js"></script>
  <script src="./jquery-ui-1.10.3/ui/jquery-ui.js"></script>
  <link rel="stylesheet" href="./jquery-ui-1.10.3/demos/demos.css"/>
  <script src="background.js"></script>

  <script src="tabStructure.js"></script>

</head>
<body>

<div id="tabs">
  <h3 id = "tabId">Tab ID</h3>
  <ul>
    <li><a href="#frame0">Main Frame</a></li>
  </ul>
  <div id="frame0">
    <p>abc</p>
    <ul>
      <li><a href="#frame1">sub_Frame</a></li>
    </ul>
    <div id="frame1">
    </div>
  </div>
</div>

</body>
</html>


TabStructure
选项卡ID



abc

background.js

function getAllFramesCallback(framesList){
    for ( i = 0 ; i < framesList.length ; i++){
        drawOnPage(framesList[i]);
    }

};    

function findChildList(frameId,framesList){
    for ( var i = 0 ; i< framesList.length ; i ++){
    if(framesList[i].parentFrameId == frameId){
        childList.push(framesList[i]);
    }
    }    

    return childList;
}
function drawOnPage(frameDetail){ 

    if(frameDetail.frameId == 0){
    var content = document.getElementById("tabs").innerHTML; /*this returns undefined*/
    content = ( content + "<p>Frame ID : HaHA</p>"); 
    document.getElementById("frame0").innerHTML = content;

    }
}


//listener for the messages send from popup page and content scripts
$(document).ready(function() {

     if(request.words == "tabStructure"){
        chrome.windows.getCurrent(function(win) { 
        chrome.tabs.query( {'windowId': win.id, 'active': true}, function(tabArray){ 
            if (tabArray) { 
            tabId2 = tabArray[0].id;
            chrome.webNavigation.getAllFrames({tabId: tabArray[0].id},getAllFramesCallback);
            } 
        }); 
        });
        chrome.windows.create({url:"tabStructure.html", type:'popup', height:450, width:600, left:1500, focused:true});
    }
    });

});

函数GetAllFrameScalBack（framesList）{ 对于（i=0；i”； document.getElementById（“frame0”）.innerHTML=content； } } //从弹出页面和内容脚本发送的消息的侦听器 $（文档）.ready（函数（）{ if（request.words==“tabStructure”）{ chrome.windows.getCurrent（函数（win）{ chrome.tabs.query（{'windowId'：win.id，'active'：true}，函数（tabArray）{ if（tabArray）{ tabId2=tabArray[0].id； chrome.webNavigation.getAllFrames（{tabId:tabArray[0].id}，getAllFrameScalBack）； } }); }); create（{url:“tabStructure.html”，类型：'popup'，高度：450，宽度：600，左侧：1500，焦点：true}）； } }); });

这是因为回调是在后台页面上下文中调用的，而不是在

tabStructure.html

上下文中调用的。要与它交互，您必须使用内容脚本：。此tabStructure.html执行