Question

我正在尝试开发一个chrome扩展，它对正在加载或更新的页面做出反应。扩展程序在iframe中呈现自身以避免来自页面CSS的干扰。当我在启用了Google即搜即得的Google搜索结果页面上运行它时，我看到控件最初正确呈现，但是当修改了查询和查询结果时，控件仅部分重新呈现。事件被正确检测到，但DOM未更新。我将问题分离到以下代码，调用它来重新呈现扩展UI：

function updatePanel() {
    console.log("updatePanel called");
    var $container = getPanel();
    var $preview = $container.find('iframe').contents().find('div');

    console.log('clearing preview div',$preview);
    $preview.empty();

    $preview.append($('<div>').text(content("div")));

    var $table = $('<table border="2" cellspacing="0" cellpadding="0">'); 
    var $cell = $('<td>');
    $table.append($('<tr>').append($cell));

    $cell.append($('<div>').text(content("table"))); // Line A
    $preview.append($table); // Line B

    console.log('widget is done, generated html:',$cell);
    return true;
}

如果带有注释//Line B的行移到//Line A之前，则表的内容无法呈现。如果//Line B跟随//Line A，则所有内容都会正确呈现。但在这两种情况下，生成的DOM应该是相同的。

相关的错误是我不能将jQuery动画应用于表的内容，因为对Line B后面的DOM的所有修改都无法应用。

这是一个记录在案的错误吗？我正在测试当前版本的Chrome（版本26.0.1410.64 m）。

编辑18/5/2013：

抱歉，我忘了加入content(label)功能：

function content(label) {
    return label + ": " + (new Date()).getTime();
}

Chrome扩展程序在谷歌即时页面上呈现不一致

0 个答案: