0

我正在构建一个启动计时器的测试脚本，执行一些随机操作，然后关闭计时器并报告执行所需的时间。这是我到目前为止得到的：

Ext.define('project.view.test', {
extend: 'Ext.Panel',
xtype: 'test',

config: {
    styleHtmlContent: true, 
    scrollabe: 'vertical',
    title: 'test',
    tpl: '<p id="time"></p>'
},
initialize: function() {
    this.measureTime();
},
measureTime: function() {
    var startTime=new Date();
    a = 2;
    for(i=0; i<1000; i++) {
        a = a*a*a*i;
    }
    var b=Math.floor((new Date()-startTime)/100)/10;
    document.getElementById('time').innerHTML = b;
}

});

这里的问题是我得到了错误：

Uncaught TypeError: Cannot set property 'innerHTML' of null

我的猜测是在执行 JS 代码之后呈现 html p-tag。真的吗？我以为脚本是逐个操作执行的，而 htmlcode 在 js-code 之上，这让我有点困惑。

我试图将 javascript 放在 html/tpl 标记中（在配置中）。它消除了错误，但没有写出任何内容。为什么？一切执行的顺序是什么，我该如何解决？

4

1 回答 1

2

我假设你想在b里面赋值<p id="time"></p>

您的最终结果应该是这样的，<p id="time">0</p>因为您的b值始终为 0。

首先，给你的面板一个itemId：

itemId: 'test'

然后您可以使用以下方法引用该面板的 dom 元素：

var panel = Ext.ComponentQuery.query('#test')[0].element.dom;

并使用innerText而不是设置值innerHTML：

panel.innerText = b;

顺便说一句，请记住，由于您没有使用任何商店，因此data配置是强制性的

这是演示：http ://www.senchafiddle.com/#Y30Ul

于 2013-03-28T14:07:06.153 回答