鼠标指向图片1时图片会变换成图片2的js代码，图片变换用document实现

以下是一种使用 DOM 操作实现的方式：

HTML 代码：

<img src="image1.jpg" id="myImage">

JavaScript 代码：

var myImage = document.getElementById("myImage");

myImage.addEventListener("mouseover", function() {
  this.src = "image2.jpg";
});

myImage.addEventListener("mouseout", function() {
  this.src = "image1.jpg";
});

解释：

1. JavaScript 代码中，首先使用 `document.getElementById` 方法获取图片元素，并将其存储在变量 `myImage` 中。
2. 然后使用 `addEventListener` 方法为图片元素添加 `mouseover` 和 `mouseout` 事件监听器。
3. 当鼠标指向图片时，`mouseover` 事件会触发函数，函数内部使用 `this.src` 将图片路径修改为 image2.jpg。
4. 当鼠标离开图片时，`mouseout` 事件会触发函数，函数内部使用 `this.src` 将图片路径修改为 image1.jpg。
5. 最后完成图片的变换效果。