Javascript 按id获取元素问题？

我试图通过使用带有

onclick

命令的图像来淡入一个方框。但我不明白为什么它不起作用

任何帮助都将不胜感激！代码如下：

<style>
  article, aside, figure, footer, header, hgroup,
  menu, nav, section { display: block; }
   #box { background:#999; width:500px; height:500px;opacity:0; }
</style>
</head>

  <div id="box"><id="box"></div>
  <div id="img"><img src="img.png" width="37" height="28" id="img"></div>


<script>
    var elem = document.getElementById("img","box");
    // attach event handler
   "img".onclick = function(){
      fadeIn( "img", 400 );
      this.onclick = null;
    };

    function setOpacity( obj, value ) {
      if ( obj ) {
        obj.style.opacity = value / 100;
        obj.style.filter  = 'alpha(opacity=' + value + ')';
        obj.style.zoom    = 1;
      }
    }

    // makes an element to fade in
    function fadeIn( dom, interval, delay ) {

          interval  = interval || 1000;
          delay     = delay    || 10;

      var opacity   = 0,
          start     = Number(new Date()),
          op_per_ms = 100 / interval;

      if ( typeof dom === "string" ) {
        dom = document.getElementById( dom );
      }

      function step() {

        var now     = Number(new Date()),
            elapsed = now - start;
            opacity = elapsed * op_per_ms;

        setOpacity( dom, opacity );

        if ( elapsed < interval )
          setTimeout( step, delay );
        else
          setOpacity( dom, 100 );
      }

      setTimeout( step, delay );
    }

</script>

文章、旁白、数字、页脚、页眉、H组、，
菜单，导航，部分{显示：块；}
#框{背景：999；宽度：500px；高度：500px；不透明度：0；}
var elem=document.getElementById（“img”、“box”）；
//附加事件处理程序
“img”.onclick=function（）{
法代因（“img”，400）；
this.onclick=null；
};
函数setOpacity（对象，值）{
如果（obj）{
obj.style.opacity=值/100；
obj.style.filter='alpha（不透明度='+值+'）'；
obj.style.zoom=1；
}
}
//使元素淡入
函数fadeIn（dom、间隔、延迟）{
间隔=间隔| | 1000；
延迟=延迟| | 10；
var不透明度=0，
开始=编号（新日期（）），
op_per_ms=100/间隔；
如果（dom的类型==“字符串”）{
dom=document.getElementById（dom）；
}
函数步骤（）{
var now=编号（新日期（）），
已用=现在-开始；
不透明度=经过时间*每毫秒运算次数；
setOpacity（dom，opacity）；
如果（经过<间隔）
设置超时（步进，延迟）；
其他的
setOpacity（dom，100）；
}
设置超时（步进，延迟）；
}

getElementById的参数不超过1个

var elem = document.getElementById("img");
var elem2 = document.getElementById("box");

此外，IE事件处理程序正在从字符串调用方法

elem.onclick = function(){
  fadeIn(this, 400 );
  return false;
};

---

我认为您在第一段代码中犯了两个错误：

<script>
    var elem = document.getElementById("img","box");
    // attach event handler
   "img".onclick = function(){
      fadeIn( "img", 400 );
      this.onclick = null;
    };

是错误的，因为函数

getElementById

只接受一个参数。如果要获取两个元素，应使用两个不同的调用：

var img = document.getElementById("img");
var box = document.getElementById("box");

其次，这是什么

"img".onclick = function(){

我想你的意思是：

elem.onclick = function(){

第一次修正后的结果为：

    img.onclick = function(){
      fadeIn( "img", 400 );
      this.onclick = null;
    };

    box.onclick = function(){
      fadeIn( "box", 400 );
      this.onclick = null;
    };

---

这样就容易多了。只需使用

$（'#someElement'）.fadeIn（）

在元素中淡入即可。如果可以的话，我建议您使用jQuery来制作这样的动画。顺便说一下，

不是有效的HTML，

“img”。onclick

是什么？你应该这样做：

elem.onclick

，这将是

elem

变量的全部要点。这里有很多问题。首先，

不是有效的HTML。getElementById只接受一个参数，即id。

new Date（）.getTime（）

或

+new Date（）

与使用

Number（new Date（））

一样有效。接下来，您将“附加事件处理程序”到一个字符串，而不是一个元素……非常感谢大家的帮助！我现在更明白了。再次感谢你。

    img.onclick = function(){
      fadeIn( "img", 400 );
      this.onclick = null;
    };

    box.onclick = function(){
      fadeIn( "box", 400 );
      this.onclick = null;
    };