关于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

首先回答你第一个和第二个问题，这两个问题其实只是一个，字符串和变量拼接的规则，必须这样。

回答你第三个问题：如果单引号（双引号）中还想用单（双引号），只有两种方式，第一是使用转义字符（\），第二是单引号中包双引号反之亦然。