HTML DOM images 集合

获取 images 集合

要获取页面中的 images 集合，可以通过 document.images 来访问。这样就可以得到一个包含所有图片元素的 HTMLCollection 对象，我们可以通过遍历这个集合来操作其中的图片元素。

示例代码：

const images = document.images;
for (let i = 0; i < images.length; i++) {
    console.log(images[i].src);
}

操作 images 集合

通过 images 集合，我们可以对页面中的图片元素进行一系列操作，比如获取图片的地址、替换图片、添加新的图片等。

获取图片地址

每个图片元素都有一个 src 属性，可以通过这个属性来获取图片的地址。

示例代码：

const images = document.images;
for (let i = 0; i < images.length; i++) {
    console.log(images[i].src);
}

替换图片

可以通过修改图片元素的 src 属性来替换图片。

示例代码：

const images = document.images;
for (let i = 0; i < images.length; i++) {
    images[i].src = 'new_image.jpg';
}

添加新图片

可以通过创建新的图片元素，并将其添加到页面中来添加新的图片。

示例代码：

const newImage = document.createElement('img');
newImage.src = 'new_image.jpg';
document.body.appendChild(newImage);

总结

通过 HTML DOM 中的 images 集合，我们可以方便地管理页面中的图片元素，获取图片地址、替换图片、添加新图片等操作。这为我们在前端开发中处理图片元素提供了便利。