javascript - 使用 JavaScript 而不是 jQuery 更改鼠标悬停时 div 内的图像宽度

Question

我是 JavaScript 新手，修复此问题遇到困难。

页面上有三个div:

Div 1 的 ID 为“div1”，并包含三个图像:

• ID:im1，src = Cat.jpg
• ID:im2，src = Dog.jpg
• ID:im3，src = Fish.jpg

Div 2 的 ID 为“div2”，其中包含三个段落。在每个文本中放入一些随机文本，但确保它们的 ID 为“p1”、“p2”和“p3”

Div 3 的 ID 为“div3”，有两个段落(ID p4 和 p5；将随机文本放入每个段落中)和两个图像(ID im4 和 im5；src = Bird.jpg 和 src = Turtle.jpg。

当窗口完成加载时，必须通过 JavaScript 设置以下行为(不要使用 jQuery):

• 当鼠标悬停在 div1 中的每个图像上时，必须将其大小调整为 100px 宽度
• 当鼠标悬停在 div3 中的每个段落上时，其背景颜色必须为黄色

Answer 1

您可以使用 CSS 来完成此任务

#div1 img:hover{ width:100px; }
#div3 p:hover{ background:yellow; }