js img

// 创建一个 img 元素并设置其属性

// 创建一个新的 img 元素
const img = document.createElement('img');

// 设置 img 元素的 src 属性，指定图片的 URL
img.src = 'https://example.com/image.jpg';

// 设置 img 元素的 alt 属性，提供图片的替代文本
img.alt = '示例图片';

// 设置 img 元素的宽度和高度
img.width = 200;
img.height = 150;

// 将 img 元素添加到页面中的某个容器元素中
document.body.appendChild(img);

// 监听 img 元素的加载事件，在图片加载完成后执行某些操作
img.onload = function() {
    console.log('图片已成功加载');
};

// 监听 img 元素的错误事件，在图片加载失败时执行某些操作
img.onerror = function() {
    console.error('图片加载失败');
};

解释说明：

1. 创建 img 元素：使用 document.createElement('img') 创建一个新的 <img> 元素。
2. 设置属性：
   • src：指定图片的 URL。
   • alt：为图片提供替代文本，当图片无法显示时会显示此文本。
   • width 和 height：设置图片的宽度和高度。
3. 添加到页面：使用 document.body.appendChild(img) 将 img 元素添加到页面的 body 中。
4. 事件监听：
   • onload：当图片成功加载时触发。
   • onerror：当图片加载失败时触发。

这段代码展示了如何动态创建并操作一个图片元素。