Javascript HTML5画布无方法'；toDataURL'；_Javascript_Html_Html5 Canvas

Javascript HTML5画布无方法'；toDataURL'；

javascript html html5-canvas

Javascript HTML5画布无方法'；toDataURL'；,javascript,html,html5-canvas,Javascript,Html,Html5 Canvas,我的代码是这样的 <html> <head> </head> <body> <canvas id="myCanvas" width="578" height="200" style="display:none;"></canvas> <img id="canvasImg" onclick="myFunction()" alt="Right click to save me!">

我的代码是这样的

    <html>
  <head>
  </head>
  <body>
    <canvas id="myCanvas" width="578" height="200" style="display:none;"></canvas>
    <img id="canvasImg" onclick="myFunction()" alt="Right click to save me!">
    <script>
        var canvas = document.getElementById('myCanvas');
        var context = canvas.getContext('2d');
        function myFunction() {
            var c = document.getElementsByTagName("canvas");
            // save canvas image as data url (png format by default)
            var dataURL = c.toDataURL();
            // set canvasImg image src to dataURL
            // so it can be saved as an image
            document.getElementById('canvasImg').src = dataURL;
        }
    </script>
  </body>
</html>

我做了一个决定有人能指出哪里出了问题吗？

document.getElementsByTagName

返回元素对象的数组，并且没有数组对象具有toDataUrl方法

而不是这个

var c = document.getElementsByTagName("canvas");

使用

var c = document.getElementsByTagName("canvas");

 var c = document.getElementsByTagName("canvas")[0];

    function myFunction() {
         var canvas = document.getElementById("myCanvas");
         var context = canvas.getContext("2d");
         var img = document.getElementById("canvasImg");
         context.drawImage(img, 0, 0);
    }