无法定位Canvas的子元素

Question

Here is my code

    javascript: (function() {
    var canvas = document.getElementById("app-view").children[1];
    var img = canvas.toDataURL("image/png");
    window.open(img);
    })();

and here is the app element where I wish to target the second canvas element "children 1 " but it's not working for some reason and always gets stuck at the first element. A solution will be much appreciated, thanks in advance!

In the picture it always targets the first canvas in yellow but I need the one displayed in blue. You can test the code by saving the script as a bookmark in your browser.

Answer 1

Haven't worked out why toDataURL gets the data of the left canvas, but if you wanted to save the canvas, you can isolate it with

var can = document.getElementById("app-view").children[1];
jQuery("body > *").remove();
jQuery("body").append(can) ;

and then now you can right click and save the canvas

Answer 2

这对我有用：

document.getElementById('app-view').childNodes[1]