id 문제로 요소 가져 오기?

Question

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> 

Answer 1

에서 getElementById는

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

은 또한 당신의 IE 이벤트 핸들러는 문자열에서 메소드를 호출되어 1 개 이상의 인수가 없습니다. 기능 getElementById이 하나 개의 매개 변수를 사용하기 때문에

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

잘못입니다 : 모든

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

첫째 :

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

Answer 2

난 당신이 코드의 첫 번째 작품 내에서 두 가지 오류를 만드는 것 같아요 . 두 가지 요소를 얻으려면 두 가지 다른 호출을 사용해야합니다.

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; 
    };