Javascript简单面向对象
这个课程的目的是在屏幕上创建X个正方形,并随机改变它们的颜色 这是:Javascript简单面向对象,javascript,oop,Javascript,Oop,这个课程的目的是在屏幕上创建X个正方形,并随机改变它们的颜色 这是: function Blocks() { var Size = 0; this.setSize = function(inputSize) { Size = inputSize; }; this.createEnvironment = function() { var Block, prevBlock, i; for (i
function Blocks() {
var Size = 0;
this.setSize = function(inputSize) {
Size = inputSize;
};
this.createEnvironment = function() {
var Block, prevBlock, i;
for (i = 0; i < Size; i++) {
Block = document.createElement('div');
Block.className = 'block';
Block.id = i;
prevBlock = document.getElementsByTagName('div')[i];
prevBlock.parentNode.insertBefore(Block, prevBlock);
}
};
this.randBlock = function() {
return document.getElementsByTagName('div')[Math.floor(Math.random() * Size)];
};
this.randColor = function() {
var Chars = '0123456789ABCDEF'.split('');
var randColor = '#';
for (var i = 0; i < 6; i++) {
randColor += Chars[Math.floor(Math.random() * Chars.length)];
}
return randColor;
};
this.goCrazy = function() {
var Block = this.randBlock();
Block.style.background = this.randColor();
var t = setTimeout('this.goCrazy()', 1000);
};
}
css代码:
.块是30x30 px,显示内联块
在调用该类之前,有一个空白的div标记,用于在何处创建块
上面的所有代码只显示一个彩色块,而不是所有的块都是彩色的,并且变化很快
Chrome的警告:
Uncaught TypeError: Object [object DOMWindow] has no method 'goCrazy'
计时器函数(setTimeout
)在其各自的作用域内执行。将代码包装到闭包中应该可以:
var t = setTimeout(function () { _self.goCrazy(); }, 1000);
请看:演示。不要使用与问题无关的保留字
对象
,但也应避免使用大写变量名,因为它们表示大多数OO语言中的类名,如语法突出显示所示。
var t = setTimeout(function () { _self.goCrazy(); }, 1000);