javascript - 關(guān)于className添加的樣式優(yōu)先級(jí)的問(wèn)題。
問(wèn)題描述
我做了一個(gè)簡(jiǎn)易日歷，用ul li做的，然后我首先用css給它使用選擇器 #p ul li 添加了一個(gè)background：black； 然后，我用js的className把所有l(wèi)i添加了一個(gè)樣式active，然后背景優(yōu)先級(jí)沒(méi)有原本的高，那么請(qǐng)問(wèn)怎么做，可以把優(yōu)先級(jí)提到最高。 --半成品代碼。。
<!DOCTYPE html><html lang='en'><head> <meta charset='UTF-8'> <title>Document</title> <style>*{ margin: 0; padding: 0;}#main{ width: 500px; height: 300px;}#main ul li{ float: left; width: 80px; height: 80px; background-color: gray; list-style: none; margin: 20px;}#main p{ width: 300px; height: 80px; border: 1px solid red; position: absolute; top:350px;}.active{ background:red; color: #fff; cursor: pointer;} </style> <script>window.onload=function(){ var op = document.getElementById(’main’); var oLi = op.getElementsByTagName(’li’); var ap = op.getElementsByTagName(’p’)[0]; var month = [’a’,’b’,’c’,’d’,’e’,’f’,’g’,’h’,’i’,’j’,’k’,’l’] for(var i=0;i<oLi.length;i++) {oLi[i].index=i;oLi[i].onmouseover=function(){ for(var i=0;i<oLi.length;i++) {oLi[i].className=''; } this.className='active'; ap.innerHTML = (this.index+1)+month[this.index];} }} </script></head><body> <p id='main'><ul> <li>1</li> <li>2</li> <li>3</li> <li>4</li> <li>5</li> <li>6</li> <li>7</li> <li>8</li> <li>9</li> <li>10</li> <li>11</li> <li>12</li></ul><p></p> </p></body></html>
問(wèn)題解答
回答1：p ul li.active{//do something
}
相關(guān)文章：
1. javascript - js控制元素樣式的疑惑2. css3 - 網(wǎng)站放在本地和放在遠(yuǎn)端服務(wù)器用 iPhone Safari 打開(kāi)樣式不同3. javascript - node.js不同模塊之間如何傳值4. android - 哪位大神知道java后臺(tái)的api接口的對(duì)象傳到前端后輸入日期報(bào)錯(cuò)，是什么情況？求大神指點(diǎn)5. mac連接阿里云docker集群，已經(jīng)卡了2天了，求問(wèn)？6. html - 哪些情況下float會(huì)失效？7. javascript - web 移動(dòng)端瀏覽器 用js 能不做判斷當(dāng)前手機(jī)安裝沒(méi)安裝app 如果安了就去打開(kāi) 沒(méi)安就去下載哇？8. css3 - text-overflow為何會(huì)在li的子標(biāo)簽a下失效9. 就一臺(tái)服務(wù)器，mysql數(shù)據(jù)庫(kù)想實(shí)現(xiàn)自動(dòng)備份，如何設(shè)計(jì)？10. [前端求職必看]前端開(kāi)發(fā)面試題與答案精選_擴(kuò)展問(wèn)題
網(wǎng)公網(wǎng)安備