编程 Javascript

JS 实现点击a标签的时候让其背景更换

Posted in Javascript onOctober 15, 2013

<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title></title> 
<script type=text/javascript src="alabel.js"></script> 
<style type="text/css"> 
.curr{background:blue;display:inline;} 
</style> </head> 
<body> 
<div class="clMenu"> 
<span><a href="#">1</a></span> 
</div> 
</body> 
</html>

在alabel.js中：

window.onload = function () 
{ 
var aspan = document.getElementsByTagName("span"); 
var i = 0; 
for (i = 0; i < aspan.length; i++) 
{ 
aspan[i].onclick = function () 
{ 
for (i = 0; i < aspan.length; i++) aspan[i].className = ""; 
this.className = "curr"; 
}; 
} 
};

这样就可以实现在点击a标签的时候给其添加红色的背景。

注意：curr的属性中display不能是block，否则添加的背景是一整行。

JS 实现点击a标签的时候让其背景更换

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

JS option location 页面跳转实现代码

Dec 27 Javascript

javascript基本类型详解

Nov 28 Javascript

JavaScript 学习笔记之操作符（续）

Jan 14 Javascript

jQuery mobile类库使用时加载导航历史的方法简介

Dec 04 Javascript

AngularJS通过$location获取及改变当前页面的URL

Sep 23 Javascript

浅谈js中function的参数默认值

Feb 20 Javascript

vue框架搭建之axios使用教程

Jul 11 Javascript

Django+Vue实现WebSocket连接的示例代码

May 28 Javascript

Vue对象赋值视图不更新问题及解决方法

Jun 03 Javascript

关于微信小程序获取小程序码并接受buffer流保存为图片的方法

Jun 07 Javascript

微信小程序如何获取地址

Dec 24 Javascript

微信小程序新闻网站详情页实例代码

Jan 10 Javascript

JS操作Cookies的小例子

Oct 15 #Javascript

如何在父窗口中得知window.open()出的子窗口关闭事件

Oct 15 #Javascript

JavaScript中prototype为对象添加属性的误区介绍

Oct 15 #Javascript

JS格式化数字保留两位小数点示例代码

Oct 15 #Javascript

js计算字符串长度包含的中文是utf8格式

Oct 15 #Javascript

Javascript中查找不以XX字符结尾的单词示例代码

Oct 15 #Javascript

通过js获取div的background-image属性

Oct 15 #Javascript

You might like

php中利用post传递字符串重定向的实现代码

2011/04/21 PHP

基于PHP array数组的教程详解

2013/06/05 PHP

ThinkPHP之用户注册登录留言完整实例

2014/07/22 PHP

php实现的树形结构数据存取类实例

2014/11/29 PHP

PHP自定义错误处理的方法分析

2018/12/19 PHP

PHP-FPM和Nginx的通信机制详解

2019/02/01 PHP

(仅IE下有效)关于checkbox 三态

2007/05/12 Javascript

javascript 简单抽屉效果的实现代码

2010/03/09 Javascript

Javascript的时间戳和php的时间戳转换注意事项

2013/04/12 Javascript

使用jQuery实现WordPress中的Ctrl+Enter和@评论回复

2016/05/21 Javascript

JavaScript函数节流概念与用法实例详解

2016/06/20 Javascript

javascript鼠标跟随运动3种效果（眼球效果，苹果菜单，方向跟随）

2016/10/27 Javascript

微信小程序 modal弹框组件详解

2016/10/27 Javascript

jQuery进阶实践之利用最优雅的方式如何写ajax请求

2017/12/20 jQuery

JS实现用特殊符号替换字符串的中间部分区域的实例代码

2018/07/24 Javascript

element-ui中的select下拉列表设置默认值方法

2018/08/24 Javascript

原生JS实现图片懒加载之页面性能优化

2019/04/26 Javascript

javascript设计模式 ? 代理模式原理与用法实例分析

2020/04/16 Javascript

[59:59]EG vs IG 2018国际邀请赛小组赛BO2 第二场 8.16

2018/08/17 DOTA

[57:59]完美世界DOTA2联赛循环赛 Ink Ice vs LBZS BO2第一场 11.05

2020/11/05 DOTA

python使用os模块的os.walk遍历文件夹示例

2014/01/27 Python

用C++封装MySQL的API的教程

2015/05/06 Python

Python 由字符串函数名得到对应的函数(实例讲解)

2017/08/10 Python

Django的CVB实例详解

2020/02/10 Python

Python+PyQt5实现灭霸响指功能

2020/05/25 Python

JupyterNotebook 输出窗口的显示效果调整实现

2020/09/22 Python

REISS美国官网：伦敦最受欢迎的时尚品牌

2019/08/16 全球购物

英国独特家具和家庭用品购物网站：Cuckooland

2020/08/30 全球购物

英国最大的天然和有机产品在线零售商之一：Big Green Smile

2020/05/06 全球购物

2014全国两会学习心得体会2000字

2014/03/10 职场文书

职业生涯规划书结束语

2014/04/15 职场文书

保卫钓鱼岛口号

2014/06/20 职场文书

学校班子个人对照检查材料思想汇报

2014/09/27 职场文书

学校国庆节活动总结

2015/03/23 职场文书

毕业论文致谢范文

2015/05/14 职场文书

初三英语教学反思

2016/02/15 职场文书