JS 實(shí)現(xiàn)點(diǎn)擊a標(biāo)簽的時(shí)候讓其背景更換
更新時(shí)間：2013年10月15日 16:38:56 作者：
點(diǎn)擊a標(biāo)簽的時(shí)候給其換背景的方法有很多，在本文將為大家介紹下js是如何實(shí)現(xiàn)的，感興趣的朋友不要錯(cuò)過(guò)
復(fù)制代碼 代碼如下:
<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中：
復(fù)制代碼 代碼如下:
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";
};
}
};
這樣就可以實(shí)現(xiàn)在點(diǎn)擊a標(biāo)簽的時(shí)候給其添加紅色的背景。
注意：curr的屬性中display不能是block，否則添加的背景是一整行。
您可能感興趣的文章:
- 基于JS實(shí)現(xiàn)彈出一個(gè)隱藏的div窗口body頁(yè)面變成灰色并且不可被編輯
- JavaScript設(shè)置body高度為瀏覽器高度的方法
- JavaScript中window、doucment、body的解釋
- JS代碼放在head和body中的區(qū)別分析
- 使用JS或jQuery模擬鼠標(biāo)點(diǎn)擊a標(biāo)簽事件代碼
- javascript和jquery修改a標(biāo)簽的href屬性
- js實(shí)現(xiàn)a標(biāo)簽超鏈接提交form表單的方法
- js確認(rèn)刪除對(duì)話(huà)框適用于a標(biāo)簽及submit
- 在JS中a標(biāo)簽加入單擊事件屏蔽href跳轉(zhuǎn)頁(yè)面
- Javascript中使用A標(biāo)簽獲取當(dāng)前目錄的絕對(duì)路徑方法
- JavaScript實(shí)現(xiàn)獲取用戶(hù)單擊body中所有A標(biāo)簽內(nèi)容的方法
相關(guān)文章
javascript跑馬燈抽獎(jiǎng)實(shí)例講解
這篇文章主要為大家介紹了javascript跑馬燈抽獎(jiǎng)特效，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-01-01
增加了對(duì)同一ID內(nèi)的多個(gè)子容器中的tag(標(biāo)簽)分別做隔行處理。div+css布局下，也可以控制了2008-05-05
js實(shí)現(xiàn)省市區(qū)三級(jí)聯(lián)動(dòng)非select下拉框版
這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)省市區(qū)三級(jí)聯(lián)動(dòng)非select下拉框版，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-09-09
JS實(shí)現(xiàn)動(dòng)態(tài)移動(dòng)層及拖動(dòng)浮層關(guān)閉的方法
這篇文章主要介紹了JS實(shí)現(xiàn)動(dòng)態(tài)移動(dòng)層及拖動(dòng)浮層關(guān)閉的方法,可實(shí)現(xiàn)動(dòng)態(tài)拖動(dòng)浮動(dòng)窗口及關(guān)閉窗口的功能,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2015-04-04
再談javascript常見(jiàn)錯(cuò)誤及解決方法
下面小編就為大家?guī)?lái)一篇再談javascript常見(jiàn)錯(cuò)誤及解決方法。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-09-09
indexOf在js中有著重要的作用,可以判斷一個(gè)元素是否在數(shù)組中存在,或者判斷一個(gè)字符是否在字符串中存在,下面這篇文章主要給大家介紹了關(guān)于js中indexOf()簡(jiǎn)單使用的相關(guān)資料,需要的朋友可以參考下2023-01-01
TypeScript中l(wèi)et和var的區(qū)別介紹
這篇文章主要介紹了TypeScript?let與var的區(qū)別,主要從作用域等這幾個(gè)方面做詳細(xì)介紹，本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2022-07-07
JS生態(tài)系統(tǒng)加速模塊解析賦能性能優(yōu)化探索
這篇文章主要為大家介紹了JS生態(tài)系統(tǒng)加速模塊解析賦能性能優(yōu)化探索,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2024-01-01
JavaScript JSON.stringify()的使用總結(jié)
JSON是一種輕量級(jí)數(shù)據(jù)格式，可以方便地表示復(fù)雜數(shù)據(jù)結(jié)構(gòu)。JSON對(duì)象有兩個(gè)方法：stringify()和parse()。在簡(jiǎn)單的情況下，這兩個(gè)方法分別可以將JavaScript序列化為JSON字符串，以及將JSON解析為原生JavaScript值。本文著重介紹JSON.stringify()的使用方法和注意事項(xiàng)。2021-05-05
微信小程序?qū)Ш綑诨瑒?dòng)定位功能示例(實(shí)現(xiàn)CSS3的positionsticky效果)
這篇文章主要介紹了微信小程序?qū)Ш綑诨瑒?dòng)定位功能,可實(shí)現(xiàn)CSS3的positionsticky效果,涉及微信小程序事件監(jiān)聽(tīng)、狀態(tài)判斷及屬性動(dòng)態(tài)操作相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下2019-01-01