关于JS实现动画效果的疑问？

Question

在看《Javascript DOM编程艺术》这本书的第10章《用JavaScript实现动画效果》时，作者提到抽象化一个函数，抽象后的代码如下：

function moveElement(elementID,final_x,final_y,interval) { 

if (!document.getElementById) return false;

if (!document.getElementById(elementID)) return false;

var elem = document.getElementById(elementID);

var xpos = parseInt(elem.style.left);

var ypos = parseInt(elem.style.top);

if (xpos == final_x && ypos == final_y) { 

return true;

} 

if (xpos < final_x) { 

xpos++;

} 

if (xpos > final_x) { 

xpos--;

} 

if (ypos < final_y) { 

ypos++;

} 

if (ypos > final_y) { 

ypos--;

} 

elem.style.left = xpos + "px";

elem.style.top = ypos + "px";

var repeat = "moveElement('" + elementID + "'," + final_x + "," + final_y + "," + interval + ")";

movement = setTimeout(repeat, interval);

}

不明白的地方在倒数第三行repeat

问题一：moveElement的四个参数为什么都要加上双引号，是因为都是字符串吗？但是实际用到的除了elementID是字符串，final_x、final_y、interval不都是数值吗？

问题二：moveElement的四个参数为什么每一个都要在前后加上+符号？

问题三：参数elementID外面加了一对双引号还有一对单引号，请问这是什么原因？

Answer 1

因为， movement = setTimeout(repeat, interval);  这里调用到repeat了。setTimeout后的第一个参数，可以是字符串，也可以是一个function。文章中，就是用字符串做参数。所以，要拼接出这个字符串。var repeat = "moveElement('" + elementID + "'," + final_x + "," + final_y + "," + interval + ")";实际效果，大概就是：movement = setTimeout("moveElement('id', 100, 100, 30)", interval);

Answer 2

首先回答你第一个和第二个问题，这两个问题其实只是一个，字符串和变量拼接的规则，必须这样。回答你第三个问题：如果单引号（双引号）中还想用单（双引号），只有两种方式，第一是使用转义字符（\），第二是单引号中包双引号反之亦然。