img标签的HTML crossorigin属性

我试图了解如何对img标签使用crossorigin属性。我找不到一个很好的例子（我发现的有关启用了CORS的图像的解释是用JavaScript代码解释的，因此，我看不到带有img标签的crossorigin属性。

我有一个猜测，如果我理解错误，请更正我的错误。

首先，可以编写以下代码片段以在画布上绘制图像：

<canvas id="canvas" width=400 height=400></canvas>
<br><br>
<img id="image" src="http://...." alt="" width="400" height="400">
<script>
function draw() {
    var canvas = document.getElementById("canvas");
    var context = canvas.getContext("2d");
    var img = new Image();
    img.crossOrigin = "Anonymous";
    img.src = document.getElementById("image").value;
    context.drawImage(img, 40, 40);
}
</script>

下面的代码与上面的代码等效吗？它不包含“ img.crossOrigin”，但在img标签中具有crossorigin属性。

<canvas id="canvas" width=400 height=400></canvas>
<br><br>
<img id="image" crossorigin="anonymous"src="http://...." alt="" width="400" height="400">
<script>
function draw() {
    var canvas = document.getElementById("canvas");
    var context = canvas.getContext("2d");
    var img = new Image();
    img.src = document.getElementById("image").value;
    context.drawImage(img, 40, 40);
}
</script>

说实话，我无法进行实验，因为我不知道哪个站点允许将其图像用作CORS。

我的猜测是，如果一个站点允许在匿名情况下完成CORS请求，则可以在画布上使用其图像，您可以在画布上绘制它；如果没有，即使请求是匿名完成的，也无法在画布上绘制它（我是不知道我是否在这里）。因此，以上两个示例都必须匿名请求CORS。

您能否说一下它们是否都相同？如果没有，您能否解释一下原因，并给我一个使用带有img标签的crossorigin属性的示例？