从源代码检查图像宽度，而不是从页面上的大小 - javascript

Question

我的用户在我的网站上提交了包含图片代码的内容。

我用过这个：

<script type="text/javascript">
$(document).ready(function () {
// check each image in the .blogtest divs for their width. If its less than X make it full size, if not its poor and keep it normal
function resize() {
    var box = $(".blogtest");
    box.find("img.buildimage").on('load', function () {
        var img = $(this),
            width = img.width();
        if (width >= 650) {
            img.addClass("buildimage-large");
        } else if (width < 500 && width > 101) {
            img.addClass("buildimage-small");
        }
        // if image is less than X, its most likely a smiley
        else if (width < 100) {
            img.addClass("buildimage-smiley");
        }
        }).filter(function () {
            //if the image is already loaded manually trigger the event
            return this.complete;
        }).trigger('load');
    }
    resize();
});
</script>

根据每个图像的大小，为每个图像分配不同的类。这样可以正常工作，但是如果用户使用ipad /小屏幕尺寸并且.blogtest div小于定义的尺寸，则它总是作为小图像放置。

我想要做的是从源头检查图像宽度，这样无论屏幕尺寸如何，我总能分配最好的等级。

感谢。克雷格。