javascript 获取img

在网页开发中，我们经常会用到标签来展示图片。在某些情况下，我们需要通过JavaScript获取到这些标签，从而对它们进行一些操作。下面就来介绍一下如何使用JavaScript获取标签，并示例说明。

如何获取标签？对于已经存在于文档中的标签，我们可以通过以下两种方法来获取：

// 方法一：通过id属性获取var myImg = document.getElementById('myImgId');// 方法二：通过标签名获取var myImgs = document.getElementsByTagName('img');

上述方法会将获取到的标签作为DOM元素返回，我们可以通过它们的属性和方法来操作这些元素。下面就以更改图片宽高为例来演示如何操作获取到的图片元素。

// 获取图片元素var myImg = document.getElementById('myImgId');// 更改宽度和高度myImg.width = '500';myImg.height = '300';

除了已经存在于文档中的标签，我们还可以通过JavaScript来创建标签，并进行相关操作。下面就以创建一个标签并更改它的src属性为例来演示如何操作。

// 创建图片元素var newImg = document.createElement('img');// 更改src属性newImg.src = 'exmaple/test.jpg';// 将图片添加到文档中，这里以body为例document.body.appendChild(newImg);

除了获取标签的属性，我们还可以通过它们的事件来监听用户操作。常用的事件有：onclick、onmouseover、onmouseout等。下面以鼠标悬停事件为例来演示如何监听。

// 获取图片元素var myImg = document.getElementById('myImgId');// 监听鼠标悬停事件myImg.onmouseover = function() {alert('你现在悬停在图片上！');};

以上就是关于如何获取标签的介绍，希望能够对你有所帮助。

上一篇：javascript 虚拟失焦

下一篇：javascript三维图形