JSFiddle - React, Tailwind, and code Playground
HTML
<html>
<head>
<title>Title of the Document</title>
<style>
img {
margin: 20px;
}
</style>
</head>
<body>
<div>Click on img to see the result</div>
<script>
let img = document.createElement('img');
img.id = 'imgId';
img.src = 'https://upload.wikimedia.org/wikipedia/commons/thumb/b/b6/Image_created_with_a_mobile_phone.png/2560px-Image_created_with_a_mobile_phone.png';
document.body.appendChild(img);
img.addEventListener("click", imgSize);
function imgSize() {
let img = document.getElementById('imgId');
//or however you get a handle to the IMG
let width = img.clientWidth;
let height = img.clientHeight;
alert("Original width=" + width + ", " + "Original height=" + height);
}
</script>
</body>
</html>i.addEventListener('load', function() {
console.log('Width: ', this.naturalWidth);
console.log('Height: ', this.naturalHeight);
});