我的代码不知道哪儿错了，请各位帮我看看~万分感谢

<!DOCTYPE html>
<html>
   <head>
       <meta charset="UTF-8">
       <title></title>
       <style type="text/css">
           #buttons{margin:50px 10%;}
           #buttons a{margin-top:50px;margin-right:10px;text-decoration:none;font-size:20px;color:black;padding:5px;border:1px solid black;}
       </style>
   </head>
   <body>
       <canvas id="canvas" height="800" width="1200" style="margin: 0 20%;border:1px solid black;">此浏览器不支持canvas,请更换浏览器</canvas>
       <div id="buttons">
           <a href="#">source-over</a>
           <a href="#">source-atop</a>
           <a href="#">source-in</a>
           <a href="#">source-out</a>
           <a href="#">destination-over</a>
           <a href="#">destination-atop</a>
           <a href="#">destination-in</a>
           <a href="#">destination-out</a>
           <a href="#">lighter</a>
           <a href="#">xor</a>
           <a href="#">copy</a>
       </div>
       <script type="text/javascript">
           window.onload=function(){
               draw("source-over");
               var buttons=document.getElementById("#buttons").getElementsByTagName("a");
               for(var i=0;i<buttons.length;i++){
                   buttons[i].onclick=function(){
                       draw(this.text);
                       return false;
                   }
               }
           }
               function draw(x){
                   var canvas = document.getElementById("canvas");
                   var context = canvas.getContext("2d");
                   /**清空画布**/
                   context.clearRect(0,0,canvas.width,canvas.height);
                   /**标题**/
                   context.font="bold 40px sans-serif";
                   context.textAlign="center";
                   context.textBaseline="middle";
                   context.fillText("globalCompsitionOperation的值为："+x,canvas.width/2,60);
                   /**方框**/
                   context.fillStyle="blue";
                   context.fillRect(300,150,500,500);

                   context.globalCompositeOperation =x;
                   /**三角形**/
                   context.fillStyle="red";
                   context.beginPath();
                   context.moveTo(700,250);
                   context.lineTo(1000,750);
                   context.lineTo(400,750);
                   context.closePath();
                   context.fill();
               }

       </script>
   </body>
</html>

qq_悄悄_0

浏览 1181回答 3

3回答

var buttons=document.getElementById("#buttons").getElementsByTagName("a"); 这句话中的document.getElementById("buttons")应该这样写，没有#。

1 0

恒爷

我的水平还没有去到那么高，知道静静看着大神回答

0 0

页面出现什么问题了？

0 0

随时随地看视频慕课网APP