几种实用的JavaScript鼠标特效,在我们平时网页设计中，鼠标特效可以说是常常会用到，那么今天我们来讲讲通过JS代码实现一些实用的鼠标特效，希望对大家有用。......
2023-03-17 528 JAVASCRIPT 鼠标
怎么获取li标签里多个img的src的值
来源：互联网
2023-03-16 23:58:21 版权归原作者所有，如有侵权，请联系我们
要获取li标签里多个img的src的值，可以通过javascript脚本来实现。下面，小编就通过一个实例来展示如何获取li标签里多个img的src值，希望能对大家有所帮助。
建立模拟环境
打开记事本
为便于讲解，我们先来搭建一个模拟环境：同时按下win R组合键，在打开的“运行”对话框中，输入notepad回车，打开记事本窗口。
生成网页文件
在记事本中，复制粘贴以下代码。依次点击菜单“文件”——“保存”，在打开的另存为对话框中，文件名输入“index.html”,保存类型选择“所有文件”，编码为“utf-8”。
html>
head>
meta charset="utf-8">
title>获取图片src/title>
/head>
body>
ul id="myul">
li>img src=1.jpg>/li>
li>img src=2.jpg>/li>
li>img src=3.jpg>/li>
/ul>
/body>
/html>
预览网页效果
双击打开刚保存的index.html网页，效果如下图所示：
模拟环境至此搭建完成。完成来要获取三个img的src值。
获取图像的src
获取图像个数
因为要获取li里面所有图像src值，所以我们先来获取图像的个数。可以在/body>标签后面加入以下代码：
script language=javascript>
var len;
len=document.getElementById('myul').getElementsByTagName('img').length;
alert(len);
/script>
这里定义了一个len变量，用来保存图像的个数，并使用alert函数，将得到的结果通过提示框弹出，以便于观察验证获取的数量是否正确。保存后，刷新网页运行效果如下：
遍历获取图像src
通过运行效果，我们可以得出上面的代码是正确的结论。
下面，我们再通过for循环和对象数组来获取所有图像的src值。修改代码如下：
script language=javascript>
var len;
len=document.getElementById('myul').getElementsByTagName('img').length;
for (var i=0;ilen;i )
{
alert("第" (i 1) "个图像的src值为：" document.getElementById('myul').getElementsByTagName('img')[i].src);
}
/script>
通过for循环对ul标签中的所有img对象进行逐一遍历，获取img对象的src，并通过alert函数弹出提示，以进行结果验证。修改后刷新网页，运行效果如下：
自我完善代码
上面的方法可以获取li标签中所有图像的src，不管一个Li标签中有一个还是多个图像，都可获取。这个网页的代码并不完美，这里主要只是给大家一个解决问题的思路，大家可以根据这个思路去进行改进，来完善自己的代码，做出更加满意的作品。
以上方法由办公区教程网编辑摘抄自百度经验可供大家参考！
标签： HTMLJAVASCRIPT
相关文章
- 详细阅读
-
如何开始学习javascript详细阅读
如何开始学习javascript,html是网页的内容，c是网页的格式，h是网站的后台，j是网站的前端，那么如何学习j，才能高效？......
2023-03-17 256 JAVASCRIPT
- 详细阅读