针对第三方提供的图片更改样式后的拉伸问题

Question

项目中的图片多来自第三方，具体的尺寸无法确定，如果直接在样式中写死图片的尺寸大小就会出现图片拉伸的现象，十分影响页面效果的美观性，因此希望可以找到一个比较好的解决方案。
在加载图片资源后获取真实尺寸和图片容器的大小，如何利用JavaScript动态地设置图片的长度和宽度以保证图片拉伸效果不影响美观。

<style>

    .img1{width:200px;height:200px;border: 1px solid #000;overflow: hidden;margin: 10px;}

    .img2{width:200px;height:90px;border: 1px solid #000;overflow: hidden;margin: 10px;}    

</style>