代码本身我目测应该没问题的，不知道你哪个版本的firebug。
你所说的渐变无效应该是另一个原因造成的。按照你的代码逻辑，for会在一瞬间循环完16次，然后延时100毫秒后，在一个瞬间切换16次颜色——我不觉得肉眼能够看得到这种所谓的瞬间渐变……（你可以试试把16次循环减少点就很明显了，你总是只能看到最后一次切换出的颜色）
你碰到的问题是，setTimeout延时是一种异步的操作，不会阻塞主体代码（你这里就是for循环）的执行，于是你主题代码中的for一瞬间就执行完了，生成的16个延时操作也跟着聚集在一起执行了。
你应该换一个思路，把下一次切换的内容放到setTimeout里去，而不要像你现在这样，在setTimeout的外部用for去实现。
我猜测下你的想法大概写了个，你参考下，应该就是你要的效果。
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
window.onload = function () {
var i=0;
var changeColor = function (node) {
node.style.backgroundColor = "#ff" + i.toString(16);
if(i<16){
i++;
setTimeout(function () {changeColor(node)},100)
}else{
i=0;
setTimeout(function () {changeColor(node)},200)
}
};
changeColor(document.body);
}
</script>
</head>
<body>
</body>
</html>PS，回头看了下突然发现其实你不是要研究渐变而是要研究闭包。好吧，那我也坑爹地学着你原来的代码样子闭一个……
<script type="text/javascript">
window.onload = function () {
var i=0;
var changeColor = function (node) {
node.style.backgroundColor = "#ff" + i.toString(16);
(function(c){
return c?function(node){
i++;
setTimeout(function () {changeColor(node)},100);
}:function(node){
i=0;
setTimeout(function () {changeColor(node)},200);
};
})(i<16)(node);
};
changeColor(document.body);
}
</script>
