jquery给img设置src

jQuery 给 img 设置 src

使用 jQuery 给 <img> 元素设置 src 属性可以通过以下几种方法实现：

使用 .attr() 方法

.attr() 方法可以获取或设置元素的属性值。通过传递属性名和值来设置 src。

$('img').attr('src', 'new-image.jpg');

使用 .prop() 方法

.prop() 方法通常用于设置 DOM 属性（如 checked、disabled），但也可以用于设置 src。

$('img').prop('src', 'new-image.jpg');

直接通过 DOM 属性设置

如果已经通过 jQuery 选中了元素，可以直接访问 DOM 对象的 src 属性。

$('img')[0].src = 'new-image.jpg';

动态设置 src 并监听加载事件

如果需要确保图片加载完成后再执行某些操作，可以监听 load 事件。

$('img').attr('src', 'new-image.jpg').on('load', function() {
    console.log('图片加载完成');
});

针对特定 img 元素设置

如果页面中有多个 <img> 元素，可以通过类名、ID 或其他选择器指定目标元素。

$('#myImage').attr('src', 'new-image.jpg');

注意事项

• 使用 .attr() 和 .prop() 的区别在于，.attr() 操作的是 HTML 属性，而 .prop() 操作的是 DOM 属性。对于 src，两者通常效果相同。
• 如果图片路径是动态生成的，确保路径正确且可访问。
• 如果图片加载失败，可以通过 error 事件处理。

$('img').on('error', function() {
    console.log('图片加载失败');
});