javascript - 无法确定 div 元素是否已在 chrome 扩展中设置在正文中

Question

在我的 chrome 扩展中，我得到了一个 div，我将把它添加到当前选项卡的正文中。我正在听 chrome.tabs.onUpdated。如果调用此事件，我会在 content_scripts 中执行一个脚本。在这个函数中，我会等到文档用 jQuery 准备好$(document).ready(...)。我尝试访问

$("#div").length

有时它返回 1，有时返回 0。它应该添加到正文中，如果它还没有的话。

由于一些奇怪的原因，onUpdated 事件在每次页面重新加载时被调用两次。实际上，我没有办法安全地检查 div 是否已经添加。

编辑：我的代码：

注入.js：

var crendentials;
var mailInfo;

function doLogin(username, password)
{
    function verifyLogin(username, password)
    {
        $.get("www.example.com&login&username=" + username + "&password=" + password,
              function (data)
              {
                 if (!isNaN($.trim(data)))
                 {
                    crendentials = new Array();
                    crendentials[0] = username;
                    crendentials[1] = password;

                    chrome.storage.sync.set({ key: "example_toolbar", value: username + ";;;" + password});
                    chrome.storage.sync.set({ key: "example_toolbar_verified", value: 1});
                }
                else
                {
                   chrome.storage.sync.set({ key: "example_toolbar_verified", value: 0});
                }
              }
       );
    }
    if (typeof username === "undefined" || username === null || username === ""
        || typeof password === "undefined" || password === null || password === "")
    {
        var crentest;
        chrome.storage.sync.get("example_toolbar",
                               function (value)
                               {
                                  console.log("value von doLogin()", value.example_toolbar);
                                  crentest = value.example_toolbar;
                               }
                            );
        if (typeof crentest !== "undefined" && crentest !== null && crentest !== "")
        {
            chrome.storage.sync.get("example_toolbar",
                                    function (value)
                                    {
                                       crendentials = value.example_toolbar.split(";;;");
                                    }
                                );
        }
   }
   else
   {
      verifyLogin(username, password);
   }
}


function getMailInfos(callback)
{
    if (typeof mailInfo === "undefined")
    {
       $.get("http://www.example.com&mailapi=showmails",
             function (data)
             {
                 mailInfo = new Array();
                 var infos = data.split("|");
                 mailInfo.unread = infos[0];
                 mailInfo.total = infos[1];
                 callback();
             }
        );
    }
    else
    {
      callback();
    }

}

function getMails(callback)
{
    if (typeof mailInfo === "undefined")
    {
       getMailInfos(function ()
                   {
                      callback(mailInfo.unread);
                   }
        );
    }
    else
    {
       callback(mailInfo.unread);
    }
}

function renderText(textstr)
{
   var divText = document.createElement("div");
   addClass(divText, "toolbarText");
   var text = document.createTextNode(textstr);
   divText.appendChild(text);
  toolbar.appendChild(divText);
}

var mailAmountDiv;
function renderMail(callback)
{
   var mailIco = document.createElement("div");
   addClass(mailIco, "mailIcon");
   mailAmountDiv = document.createElement("div");
   mailAmountDiv.id = "mails_unread";
   addClass(mailAmountDiv, "mailAmount");
   mailIco.appendChild(mailAmountDiv);
   getMails(function (value)
            {
               var mailAmount = document.createTextNode(value);
               mailAmountDiv.appendChild(mailAmount);
               toolbar.appendChild(mailIco);
               renderPlaceholderSmall();
               renderText(translations.notAttended + ": " + getNotRead());
            }
    );
}

function createToolbar(change)
{
   $(document).ready(function()
                    {

                       console.log("ist vorhanden: ", $("#Example-Toolbar").length);
                       if ($("#Example-Toolbar").length > 0)
                       {
                          // already created, stop working here
                          return;
                       }
                       doLogin();
                       toolbar = document.createElement("div");
                       toolbar.id = "Example-Toolbar";
                       renderMail(function()
                                  {
                                      renderPlaceholderLarge();
                                      renderSearch();
                                      renderPlaceholderSmall();
                                      renderRightIcons();
                                      $("body").css({"margin-top": "23px", "z-index": -1});
                                      //document.body.insertBefore(toolbar, document.body.childNodes[0]);
                                      $(toolbar).prependTo("body");
                                  }
                        );
                  }
            );
}

背景.js：

function tabListener(tabId, changeInfo, tab)
{
   // exec script on current focused tabId
  chrome.tabs.executeScript(tabId,
                            {
                               code: 'createToolbar();'
                            }
              );
}

chrome.tabs.onUpdated.addListener(tabListener);

manifest.json（仅必要部分）：

"background": {
    "scripts": [
        "background.js"
    ]
},

"permissions": [
    "tabs",
    "http://*/",
    "https://*/",
    "file:///*/*",
    "storage"
],

"content_scripts": [{
    "matches": ["*://*/*"],
    "css": ["jquery-ui.css", "style.css"],
    "js": ["jquery-2.0.3.min.js", "jquery-ui.min.js", "inject.js"],
    "run_at": "document_start"
}]