我正在构建一个测试脚本,它启动一个计时器,执行一些随机操作,然后关闭计时器并报告执行所需的时间。这是我到目前为止所得到的:
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标签中(在配置中)。它会删除错误,但不会写出任何内容。为什么?一切都按顺序执行,我该如何解决?
答案 0 :(得分:2)
我假设您要在b
<p id="time"></p>
值
,因为您的<p id="time">0</p>
值始终为0,所以最终结果应该与b
类似。
首先,为您的小组提供itemId
:
itemId: 'test'
然后您可以使用以下方法引用该面板的dom元素:
var panel = Ext.ComponentQuery.query('#test')[0].element.dom;
并使用innerText
而不是innerHTML
设置值:
panel.innerText = b;
顺便说一句,请记住,因为您没有使用任何商店,所以data
配置是强制性的