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,否则添加的背景是一整行。

Javascript 相关文章推荐
JQuery插件Style定制化方法的分析与比较
May 03 Javascript
利用div+jquery自定义滚动条样式的2种方法
Jul 18 Javascript
用javascript判断IE版本号简单实用且向后兼容
Sep 11 Javascript
JQuery工具函数汇总
Jun 15 Javascript
浅谈JavaScript中setInterval和setTimeout的使用问题
Aug 01 Javascript
巧用Vue.js+Vuex制作专门收藏微信公众号的app
Nov 03 Javascript
实现JavaScript高性能的数据存储
Dec 11 Javascript
详解JS中的快速排序与冒泡
Jan 10 Javascript
微信小程序使用wxParse解析html的方法教程
Jul 06 Javascript
Vue.set() this.$set()引发的视图更新思考及注意事项
Aug 30 Javascript
js实现金山打字通小游戏
Jul 24 Javascript
适合后台管理系统开发的12个前端框架(小结)
Jun 29 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生成缩略图的函数代码(修改版)
2011/01/18 PHP
PHP CURL模拟登录新浪微博抓取页面内容 基于EaglePHP框架开发
2012/01/16 PHP
探讨Smarty中如何获取数组的长度以及smarty调用php函数的详解
2013/06/20 PHP
PHP实现全角字符转为半角方法汇总
2015/07/09 PHP
详解WordPress中提醒安装插件以及隐藏插件的功能实现
2015/12/25 PHP
PHP7变量处理机制修改
2021/03/09 PHP
有趣的javascript数组定义方法
2010/09/10 Javascript
Javascript浅谈之this
2013/12/17 Javascript
Node.js连接postgreSQL并进行数据操作
2016/12/18 Javascript
Vue.js在使用中的一些注意知识点
2017/04/29 Javascript
vue2.0中vue-cli实现全选、单选计算总价格的实例代码
2017/07/18 Javascript
详解Angular6.0使用路由步骤(共7步)
2018/06/29 Javascript
React Component存在的几种形式详解
2018/11/06 Javascript
在Create React App中使用CSS Modules的方法示例
2019/01/15 Javascript
js实现微信聊天效果
2020/08/09 Javascript
[13:40]TI3青蛙君全程回顾 DOTA2我们为梦想再战
2013/09/13 DOTA
详解Python的Django框架中的通用视图
2015/05/04 Python
Python去除字符串两端空格的方法
2015/05/21 Python
Python错误: SyntaxError: Non-ASCII character解决办法
2017/06/08 Python
Python中装饰器高级用法详解
2017/12/25 Python
Python入门之后再看点什么好?
2018/03/05 Python
python utc datetime转换为时间戳的方法
2019/01/15 Python
浅谈Python中threading join和setDaemon用法及区别说明
2020/05/02 Python
Pandas的数据过滤实现
2021/01/15 Python
英国骑行、跑步、游泳、铁人三项运动装备专卖店:Wiggle
2016/08/23 全球购物
加拿大领先的牛仔零售商:Bluenotes
2018/01/22 全球购物
世界各地的旅游、观光和活动:Isango!
2019/10/29 全球购物
新西兰最大的连锁超市:Countdown
2020/06/04 全球购物
餐饮业创业计划书范文
2014/01/06 职场文书
安全生产汇报材料
2014/02/17 职场文书
大学生村官演讲稿
2014/04/25 职场文书
文明社区申报材料
2014/08/21 职场文书
安全生产月宣传标语
2014/10/06 职场文书
学生会感恩节活动方案
2014/10/11 职场文书
报案材料怎么写
2015/05/25 职场文书
利用Python+OpenCV三步去除水印
2021/05/28 Python