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 相关文章推荐
表单填写时用回车代替TAB的实现方法
Oct 09 Javascript
不使用中间变量,交换int型的 a, b两个变量的值。
Oct 29 Javascript
jQuery文本框(input textare)事件绑定方法教程
Apr 24 Javascript
实现动画效果核心方式的js代码
Sep 27 Javascript
javascript计算用户打开网页的停留时间
Jan 09 Javascript
60个很实用的jQuery代码开发技巧收集
Dec 15 Javascript
jquery实现submit提交表单
Feb 03 Javascript
基于React.js实现原生js拖拽效果引发的思考
Mar 30 Javascript
微信小程序实现选项卡效果
Nov 06 Javascript
新版小程序登录授权的方法
Dec 12 Javascript
vue使用i18n实现国际化的方法详解
Sep 05 Javascript
微信小程序表单验证WxValidate的使用
Nov 27 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 操作符与控制结构
2012/03/07 PHP
显示、隐藏密码
2006/07/01 Javascript
支持ie与FireFox的剪切板操作代码
2009/09/28 Javascript
jQuery 打造动态下滑菜单实现说明
2010/04/15 Javascript
jquery下将选择的checkbox的id组成字符串的方法
2010/11/28 Javascript
js面向对象设计用{}好还是function(){}好(构造函数)
2011/10/23 Javascript
Javascript页面添加到收藏夹的简单方法
2013/08/07 Javascript
jquery 快速回到页首的方法
2013/12/05 Javascript
jquery遍历select元素(实例讲解)
2013/12/31 Javascript
jQuery实现的手机发送验证码倒计时效果代码分享
2015/08/24 Javascript
jQuery 插件封装的方法
2016/11/16 Javascript
整理一下常见的IE错误
2016/11/18 Javascript
微信小程序 引用其他js文件实现代码
2017/02/22 Javascript
基于AngularJS的简单使用详解
2017/09/10 Javascript
jQuery仿移动端支付宝键盘的实现代码
2018/08/15 jQuery
如何在 JavaScript 中更好地利用数组
2018/09/27 Javascript
python list中append()与extend()用法分享
2013/03/24 Python
Python中的字典遍历备忘
2015/01/17 Python
详解Python中time()方法的使用的教程
2015/05/22 Python
Python3之文件读写操作的实例讲解
2018/01/23 Python
为什么你还不懂得怎么使用Python协程
2019/05/13 Python
python 多进程和协程配合使用写入数据
2020/10/30 Python
CSS3制作ajax loader icon实现思路及代码
2013/08/25 HTML / CSS
英国首屈一指的票务公司:See Tickets
2019/05/11 全球购物
TCP/IP的分层模型
2013/10/27 面试题
建筑公司文秘岗位职责
2013/11/29 职场文书
商场经理竞聘演讲稿
2014/01/01 职场文书
求职简历的自我评价
2014/01/31 职场文书
校园主题婚礼活动策划方案
2014/09/15 职场文书
教师党的群众路线教育实践活动剖析材料
2014/10/09 职场文书
颐和园英文导游词
2015/01/30 职场文书
2015年助理政工师工作总结
2015/05/26 职场文书
2019最新公司租房合同(例文)
2019/07/18 职场文书
坚持不是死撑,更重要的是心态
2019/08/19 职场文书
Mysql官方性能测试工具mysqlslap的使用简介
2021/05/21 MySQL
python运行脚本文件的三种方法实例
2022/06/25 Python