js如何给多个图片添加hover文字？

const imgList = document.getElementsByClassName('content')[0].getElementsByTagName('img')

for(let i=0i<imgList.lengthi+=1){

$(imgList[i]).hover(function(){

$(imgList[i]).css("background-color","yellow")

},function(){

$(imgList[i]).css("background-color","transparent")

})

}

混着用的 js的写法复杂一点 所以引入了jq写的

1. 通过改变图片的背景位置，使用background-position属性：

.selector {

background-position: 0 0

}

.selector:hover {

background-position: 0 -50px

}

2. 通过使用background-image属性，可以加载两个完全不同的图片：

.selector {

background-image: url(image1.png)

}

.selector:hover {

background-image: url(image2.png)

}

3. 通过使用transition属性，可以实现图片的平滑过渡效果：

.selector {

background-image: url(image1.png)

transition: background-image 0.5s

}

.selector:hover {

background-image: url(image2.png)

}

---