IE 11 또는 Edge의 배열 요소에서 jQuery 메서드를 호출 할 수없는 이유

<div> 요소 그룹에 jQuery.animate를 사용하여 애니메이션을 적용하려고합니다. 그러나 배열을 반복 할 때 애니메이션 메서드는 요소에 정의되어 있지 않습니다. 물론 크롬에서는 잘 작동합니다.IE 11 또는 Edge의 배열 요소에서 jQuery 메서드를 호출 할 수없는 이유

배열에 유효한 애니메이션 방법이 있지만 각 요소에는 없습니다.

<!DOCTYPE html> 
<html> 
<head> 
<link rel="stylesheet" title="Standard" href="/css/styles.css" type="text/css" media="screen" /> 

<script src="http://code.jquery.com/jquery-3.2.1.js"></script> 
<script> 
    var confettiPlayers = []; 

    function makeItRain() { 
     var confetti = $(".snow");//document.querySelectorAll('.snow'); 

     for (var i = 0, len = confetti.length; i < len; ++i) { 
      var snowball = confetti[i]; 

      snowball.innerHTML = '<div class="rotate"><div class="askew"></div></div>'; 
      var scale = Math.random() * .8 + .2; 

      // The next line throws exception on IE11/Edge 
      // SCRIPT438: Object doesn't support property or method 'animate' 
      var player = snowball.animate([ 
        { transform: 'translate3d(' + (i/len * 100) + 'vw,0,0) scale(' + scale + ')', opacity: scale }, 
        { transform: 'translate3d(' + (i/len * 100 + 10) + 'vw,100vh,0) scale(' + scale + ')', opacity: 1 } 
       ], { 
         duration: Math.random() * 3000 + 3000, 
         iterations: Infinity, 
         delay: -(Math.random() * 5000) 
        }); 


      confettiPlayers.push(player); 

     } 
    } 

    $(document).ready(function() { 
     makeItRain(); 
    }); 
</script> 
</head> 
<body> 
    <div class="snowfall"> 
     <div class="snow"></div> 
     <div class="snow"></div> 
     <div class="snow"></div> 
     <div class="snow"></div> 
     <div class="snow"></div> 
     <div class="snow"></div> 
    </div> 
</body> 
</html>

단일 요소에서 animate()를 테스트했지만 정상적으로 작동합니다.

snowball는 HTMLElement 아닌 jQuery 객체입니다 코드 var snowball = confetti[i];에서

출처

2017-12-21 NebulaSleuth

의 jQuery 객체가된다'snowball'는의 jQuery 객체가 아닌 그래서 '아무튼 :이 IE에서 지원되지 않는 HTMLElement 방법 HTMLElement#animate입니다 'animate' 메소드를 가지고 있습니다. '$ (snowball) .animate'를 원하셨습니까? – Xufox

. 당신이 var snowball = $(confetti[i]);를 사용할 필요가 https://developer.mozilla.org/en-US/docs/Web/API/Element/animate

그래서 snowbal이 대신 HTMLElement

출처

2017-12-21 23:38:33

Doh !! 감사. 나는 이것이 다른 브라우저에서 지원되지 않았다는 것을 몰랐다. – NebulaSleuth

이것이 재미 있기 때문에 나는 그것을 위해 바이올린을 만들었다 : https://jsfiddle.net/ce6mkcy6/ –

IE 11 또는 Edge의 배열 요소에서 jQuery 메서드를 호출 할 수없는 이유

답변

관련 문제