关于Javascript DOM编程艺术第2版 第十章代码范例的疑问

Question

代码如下

function moveElement(element,final_x,final_y,interval) {
  if (!document.getElementById) return false;
  if (!document.getElementById(element)) return false;
  var elem = document.getElementById(element);
  if (elem.movement) {
    clearTimeout(elem.movement);
  }
  if (!elem.style.left) {
    elem.style.left = "0px";
  }
  if (!elem.style.top) {
    elem.style.top = "0px";
  }
  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) {
    var dist = Math.ceil((final_x - xpos)/10);
    xpos = xpos + dist;
  }
  if (xpos > final_x) {
    var dist = Math.ceil((xpos - final_x)/10);
    xpos = xpos - dist;
  }
  if (ypos < final_y) {
    var dist = Math.ceil((final_y - ypos)/10);
    ypos = ypos + dist;
  }
  if (ypos > final_y) {
    var dist = Math.ceil((ypos - final_y)/10);
    ypos = ypos - dist;
  }
  elem.style.left = xpos + "px";
  elem.style.top = ypos + "px";
  var repeat = "moveElement('"+element+"',"+final_x+","+final_y+","+interval+")";
  elem.movement = setTimeout(repeat,interval);
}

这段代码摘抄自Javascript DOM编程艺术第2版 第十章
里面的一个变量elem,如果我改成通过类名或标签名中的第0项来获取节点,
例如

var elem = document.getElementsByTagName(element)[0];
或
var elem = document.getElementsByClassName(element)[0];

这样运行函数会报错,只有通过id获取节点才能正常运作,实在十分不明白

请问各位大神这里面是什么原理?谢谢

Answer 1

所以，你传入的 element 值是什么。

Answer 2

这几个方法获取的参数最终都要是字符串。只要保证传入的都是正确的已有的id名、类型和标签名，方法本身应该是没问题的。
看你的报错，应该是没找到对象的getElementsByTagName方法，document是不是拼错了。

另外if (!document.getElementById(element)) return false;别忘了修改这句判断。