Using the “nth-of-type()” in canvas and remove the one image

This sample code to using the "nth-of-type()" in canvas and remove the one image which you want to select. You can pass the number into "nth-of-type()" 
<!DOCTYPE HTML>
<html>
<head>
    <meta name="viewport" content="width=device-width,user-scalable=no"/>
    <link rel="stylesheet" href="./css/jquery.mobile-1.3.2.css"/>
    <script type="text/javascript" src="./js/jquery-1.9.1.js"></script>
</head>
<body>
    <canvas id="myCanvas">your browser does not support the canvas tag </canvas>
    <canvas id="myCanvas2"></canvas>
    <button id="btn">button</button>
</body>

<script type="text/javascript">

    var canvas=document.getElementById('myCanvas');
    var ctx=canvas.getContext('2d');
    ctx.fillStyle='#FF0000';
    ctx.fillRect(0,0,80,100);
    
    var canvas2 = document.getElementById("myCanvas2");
    var ctx2 = canvas2.getContext('2d');
    ctx2.fillStyle='#0000FF';
    ctx2.fillRect(0,0,40,50);

    $('#btn').click(function(){
	    $('canvas:nth-of-type(2)').remove();	
    });
</script>
</html>
List

Responses

0 Replies