js DOM编程艺术 第十章的相关问题?

<!DOCTYPE html>
<html>
<head>
    <title>Explaining the Document Object</title>
    <meta charset="utf-8">
    <script type="text/javascript">
        function positionMessage(){
            var elem=document.getElementById("message");
            elem.style.position="absolute";
            elem.style.left="50px";
            elem.style.top="100px";
            moveElement("message",200,100,10);
        }
        function moveElement(elementID,final_x,final_y,interval){
    
            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);
        }
        window.onload=positionMessage;
    </script>
</head>
<body>
    <p id="message">Whee!</p>
</body>
</html>

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

请问“+...+”是什么意思,有相关的知识介绍吗?网上说这样做才能当参数传递。还有为什么是'"+elementID+"',moveElement("message",200,100,10);

elementID不就等于“message”,也就是字符串,为什么还要再加上‘’?
谢谢各位大神的指导!

阅读 3.5k
4 个回答

+...+ 是字符串的拼接,大兄弟基础不牢啊,这样的问题不应该出现

楼上说的对 就是字符串拼接呀 c="a"+"b";

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

这样能明白不?这是个比较典型的拼接字符串做setTimeout参数,虽然elementID传递进来就是个字符串,但是拼接到这个大字符串里边以后引号会消失,所以需要再加对单引号上去。这个建议你在下边再加一句console.log(repeat)看下拼完之后是个什么东西大概就能明白了。另外这句在解析的时候,是先碰到第一个"字符,然后再找第二个"字符,找到之后才会作为一个完整字符串,你从中间显眼的地方开始看肯定会越看越乱的。

字符串拼接,不过现在一般都习惯于用一个匿名function把需要执行的代码裹进去:

var repeat="moveElement('"+elementID+"',"+final_x+","+final_y+","+interval+")";
movement=setTimeout(function(){
    moveElement(elementID, final_x, final_y, interval);
},interval);

比下面的更容易维护

var repeat="moveElement('"+elementID+"',"+final_x+","+final_y+","+interval+")";
movement=setTimeout(repeat,interval);
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题