如何在JavaScript/jQuery中改变一个img元素的src属性

  • Post category:jquery

在JavaScript/jQuery中改变一个img元素的src属性,通常可以用以下几种方法:

JavaScript

使用纯JavaScript可以通过以下代码实现:

var imgElement = document.getElementById("img1"); // 获取img元素
imgElement.src = "new_image.jpg"; // 修改src属性

其中,getElementById()可以获取HTML页面中具有给定ID的第一个元素。在本例中,我们将ID设置为img1,即可获取图片元素。接下来,我们可以直接使用.操作符来修改元素的属性,此处修改的是src属性。

jQuery

使用jQuery可以通过以下代码实现:

$("#img1").attr("src", "new_image.jpg");

其中,$()用于选择DOM元素。attr()用于获取或设置元素属性值,第一个参数为属性名,第二个参数为属性值。

示例说明

现在假设我们有一个图片<img>元素,其ID为img1src属性为old_image.jpg

我们想要通过JavaScript改变其src属性值,我们可以按照如下方式操作:

var imgElement = document.getElementById("img1"); // 获取img元素
imgElement.src = "new_image.jpg"; // 修改src属性

而如果我们想要通过jQuery修改图片的src属性,我们可以如下操作:

$("#img1").attr("src", "new_image.jpg");

以上是改变<img>元素src属性的两种方法,具体应该选择哪种方法可根据实际场景具体决定。