从href中获取原始大小的图像(高度和宽度),并将它们放在属性上,可以通过以下步骤实现:
$('.image-class')
。.attr()
方法获取图像元素的src
属性值,该属性值包含图像的URL。Image
对象,并将图像的URL赋值给src
属性。naturalWidth
和naturalHeight
属性获取图像的原始宽度和高度。.attr()
方法将宽度和高度设置为data-width
和data-height
属性:$(this).attr('data-width', image.naturalWidth)
和$(this).attr('data-height', image.naturalHeight)
。以下是一个示例代码:
$('.image-class').each(function() {
var imageUrl = $(this).attr('src');
var image = new Image();
image.src = imageUrl;
image.onload = function() {
$(this).attr('data-width', image.naturalWidth);
$(this).attr('data-height', image.naturalHeight);
};
});
这样,每个图像元素都会获取到其原始大小,并将宽度和高度存储在data-width
和data-height
属性中。你可以根据需要进一步处理这些属性值,例如用于显示图像的缩略图或其他用途。
推荐的腾讯云相关产品:腾讯云对象存储(COS)。
腾讯云对象存储(COS)是一种安全、高可用、低成本的云端存储服务,适用于存储和处理任意类型的文件,包括图像文件。你可以使用腾讯云对象存储(COS)来存储图像文件,并通过其提供的API获取图像的元数据,包括原始宽度和高度。
腾讯云对象存储(COS)产品介绍链接地址:https://cloud.tencent.com/product/cos
领取专属 10元无门槛券
手把手带您无忧上云