js若何让li指标的目的对应的a标签?也就是点到哪个a标签 , 阿谁a标签前面才出去li的符号图形 。 要达到这个方针 , 我们可以经由过程动态点窜li标签的样式来实现 , 具体操作请大师跟从小编一路来看看吧 。
文章插图
方式/
1搭建测试情况
打开记事本 , 输入以下代码:
<html>
<head>
<meta charset="utf-8">
<title>LI指标的目的当前A标签</title>
<style>
li {
list-style:none;
}
</style>
</head>
<body>
<br/><br/>
<ul>
<li><a>雪碧</a></li>
<li><a>可乐</a></li>
<li><a>凉茶</a></li>
</ul>
</body>
</html>
保留当作网页文件test.html 。 如不清晰若何保留 , 请查看下面经验前面建立网页部门 。
0怎么获取li标签里多个img的src的值
文章插图
2建立点击A标签后的LI样式
我们为点击A标签后的LI新建一个样式 , 样式名为newli , 具体样式如下:
.newli{list-style:square;}
该代码放在head尺度中的<style></style>标签对内 , 如下图所示 。
文章插图
3为所有A标签增添onclick事务
经由过程遍历文档内所有的A标签 , 为其添加onclick事务 , 响应动作是弹出一个信息提醒 。
在</body>标签后插手以下代码:
<script language=javascript>
var len=document.getElementsByTagName('a').length;
for(var i=0;i<len;i++)
{
document.getElementsByTagName('a')[i].onclick=function()
{
alert("我是个A标签 。 ");
}
}
</script>
文章插图
4完美onclick事务响应动作
在function()函数中将“alert("我是个A标签 。 ");”代码点窜当作如下代码:
this.parentNode.className='newli';
点窜“被点击的”A标签地点LI标签的样式为newli 。
文章插图
5方针达到了吗?
保留后刷新浏览器 , 点击一个A标签 , A标签前呈现了符号图标 , 仿佛已经达到使命要求 , 但再次点另一个A标签 , 该A标签前也能正常呈现符号图标 , 但第一个A标签前呈现的符号图标却仍然存在 , 这与我们的需求不相符 , 代码还需完美 。
推荐阅读
- 如何批量修改阿里国际站上规格化产品的发货期
- 用光影魔术手 如何给照片祛斑
- 手机上微信如何清理存储空间
- 手机京东如何绑定京东E卡
- 如何清除手机招商银行APP的缓存
- 支付宝疫苗快查功能如何使用
- 如何移出微信黑名单的人
- 优酷如何绑定qq账户
- 手机如何免费快速下载酷狗App音乐
- 二进制数与十六进制数之间如何互相转换